About this resource
Gradient Loom lets you place up to 12 color points on a canvas and drag them around to create soft mesh gradients. You can add noise, blur and a slow animation, then export as layered CSS gradients, an SVG under 10 KB or a PNG up to 8K. Every gradient has a shareable URL that encodes its settings.
It's handy for front-end developers building hero backgrounds and designers who want something richer than a two-stop linear gradient. The tool is free with no account, and exported gradients can be used anywhere. The caveat: the CSS export approximates the mesh with stacked radial gradients, so it looks slightly smoother than the canvas preview.
Highlights
- 01SVG exports under 10 KB
- 02Settings stored in a shareable URL
- 03Optional noise to prevent color banding