CSS Gradient
Compose linear or radial gradients with up to three color stops, set the angle, and watch the full-page preview update live. Copy production-ready CSS in one click.
FAQ
Which CSS is generated?
A single background property, e.g. linear-gradient(135deg, #ff7a1a, #ffd166) — works in every modern browser.
Linear or radial?
Both. Linear sweeps at an angle you control; radial radiates outward from the center.
How many color stops can I use?
Up to three. Fewer stops give cleaner, more modern-looking gradients.