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
- Paste input or drop a file above.
- Adjust options (delimiter, dialect, quality, ratio).
- Copy result or download — no sign-up needed.
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.