Backgrounds

Mesh gradients, patterns and shapes, in PNG, SVG or CSS.

What it does

Makes a background for a video, a thumbnail, a story, a wallpaper or a website.

Gradient: soft blobs of color (a “mesh” gradient). Animate makes them drift slowly in the SVG and the CSS; the PNG is a still.
Pattern: dots, lines, a grid, diamonds, crosses or a zigzag, in color 1 on the background.
Shapes: a blob, waves, a diagonal or a curve, in up to three layers (colors 1, 2, 3). Waves, diagonals and curves make section dividers for a website.
Shuffle draws another layout with the same settings. Grain adds film-like noise on top.
PNG: the chosen format and size (HD: 1080 px on the short side, 4K: 2160 px). SVG: the same image, light and sharp at any size. CSS: real CSS gradients for the gradient, the SVG as a background image for patterns and shapes.
The grain of the SVG and CSS is a noise filter, very close to the PNG one by eye.

Free, no account, nothing is sent: it runs in your browser, even offline.