Gradient Generator
Stack up colour stops, set the angle and watch the preview update as you go. When it looks right, copy the CSS and paste it straight into your stylesheet.
Settings
Two stops minimum, five maximum. New stops land in the widest gap, coloured as a blend of their neighbours.
Ignored for radial gradients — the angle control disables itself.
Output
How it works
A gradient is just a list of colour stops — each with a colour and a position — handed to CSS in one declaration. Linear gradients sweep across at your chosen angle (90° runs left to right); radial gradients bloom outward from the centre, which is why the angle has nothing to do there.
The honest limit: the preview is rendered by your own browser, so what you see is what modern browsers will draw — very old ones may render the same CSS slightly differently. If a gradient has to look identical everywhere, test it in the browsers your visitors actually use.