Gradient generator
Design smooth CSS gradients, fine-tune each color stop and copy production-ready CSS.
How to use this tool, with screenshots →TypePresets
Color stops
0%
55%
100%
CSS
background: #6d5efc; background: linear-gradient(120deg, #6d5efc 0%, #e85dc5 55%, #ff9a3c 100%);
Frequently asked questions
Do CSS gradients work in all browsers?
Linear and radial gradients work in every modern browser. Conic gradients are supported in all current versions of Chrome, Edge, Safari and Firefox.
Why is there a solid background line in the CSS?
It is a fallback color for very old browsers or email clients that ignore gradients.