Loading…
Design linear and radial CSS gradients with live preview.
Design beautiful linear and radial CSS gradients with a live preview. Pick your colors, set the angle, and copy the ready-to-use CSS background rule for your website.
background: linear-gradient(90deg, #6d28d9, #ec4899);Runs entirely in your browser — nothing is uploaded.
Paste the background rule onto any element, e.g. a div or a section, and the gradient appears as its background.
Yes — for linear gradients, use the angle slider to set the direction from 0 to 360 degrees.