Linear Gradient Generator

Make a clean linear gradient without fiddling with colour codes. Pick from curated palettes of traditional Japanese colours or set your own stops, then shape how the colours divide along the axis. Export the result as SVG or PNG, or paste it into Figma as editable layers.

Frequently asked questions

How is this different from a CSS gradient picker?

Instead of raw colour codes, you start from curated palettes tuned to look good together, and you control how the colours divide with draggable stops. The export is a crisp SVG you can drop anywhere, including Figma.

How many colours can a gradient have?

Several stops per gradient, and you can reorder, replace, and re-divide them freely.

More gradient tools

Linear Gradient Generator is part of the Gradient Builder on FeralUI, a small library of playful, physics-driven React elements.