Gradient, Mesh and Texture Generators

Generators and libraries for gradients, mesh backgrounds, grain, blobs and SVG patterns. Useful for hero sections, cards and slides that need depth without a photo.

6 resources5 freeFilter in the Finder

LDS pick

designgradients.com

Linear gradients curated by talented artists, ready to drop into any project.

Gradients & Textures Free
LDS pick

fffuel.co

60+ free SVG generators for patterns, gradients, blobs, textures and backgrounds.

Gradients & Textures Free

haikei.app

Generates SVG blobs, waves, layered peaks, blurry gradients and other backgrounds. Randomize, tweak, export as SVG or PNG.

Gradients & Textures Freemium

shaders.paper.design

Zero-dependency WebGL shaders (mesh gradients, grain, dithering, halftone, liquid metal) shipped as React components.

Gradients & Textures Free

meshgradient.com

Drag points on a WebGL canvas to warp colors into organic mesh gradients, then export. Quick hero and card backgrounds.

Gradients & Textures Free

cssgradient.io

Linear and radial gradient generator with copy-ready CSS, plus a library of curated gradient swatches.

Gradients & Textures Free

More in Design Resources

Weekly newsletter · Every Tuesday

New references, every Tuesday.

The newest additions to the library, three LDS picks worth revisiting and a category spotlight, in one short email.

  • Free forever
  • Hand-picked
  • Unsubscribe anytime

Browse past issues