Mesh Gradient
Soft, flowing color gradients from several blurred color fields. Export as PNG, JPG, WebP, SVG or CSS.
Open in editorHero backgrounds
Gradients, shaders and generative motifs for the big first impression at the top of your website. Turn on “In context” to see right away whether a title and button stay readable on it.
11 generators
Shader Gradient
Liquid, silky and grainy gradients from a GPU shader. With domain warping, Bayer dithering, grain and vignette. PNG, JPG and WebP up to 8K, plus seamless GIF loops.
Open in editor
Blurry Gradient
Dreamy backgrounds from large, strongly blurred color circles. Export as PNG, JPG, WebP, SVG or CSS.
Open in editor
Animated Gradient Generator
Moving, rotating and color-shifting gradients and floating blobs as pure CSS. Copy CSS, Tailwind or HTML, or export PNG and GIF.
Open in editor
Blob Composition
Several blobs at corners and edges that adapt to any canvas size. Export as SVG or image.
Open in editor
3D Perspective Grid
Retro grid in 3D perspective with sun, stars, mountains and glow, the synthwave and outrun look. Export as SVG, image or animated GIF.
Open in editor
Flow Fields
Thousands of lines follow an invisible flow, like wind, water or hair. Export as SVG, image or GIF.
Open in editor
Topographic Lines
Contour lines like on a map, as outlines or filled elevation bands. Export as SVG, image or GIF.
Open in editor
Low Poly & Voronoi
Faceted backgrounds from triangles or Voronoi cells, colored by a gradient through your palette. Export as SVG, image or GIF.
Open in editor
Starry Sky
A starry night sky with a color gradient, twinkling stars and sparkles. Export as SVG or image.
Open in editor
Noise and Grain
Grainy textures and backgrounds with fine noise over a color or gradient. Export as PNG, JPG, WebP or SVG.
Open in editor