CSS Gradient Generator
Design CSS gradients online: linear/radial, up to 5 color stops, angle control, live preview, copy-ready code.
CSS gradient generator
0%
100%
Preview
background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
How to use
- Add 2 to 5 stops; pick colors and positions; set angle.
- Check live preview.
- Copy the background line into your stylesheet.
FAQ
How many stops?
2 to 5. More stops, smoother blends — position each 0–100%.
Output format?
One background declaration, ready to paste into any stylesheet.