CSS Gradient Generator
① Design / Assets
What it is: A gradient is a background that fades smoothly between colors. Drag a bit and get the matching CSS.
When to use: When you want a gradient for a button, card, or page background.
Color stops
CSS code
Everything runs locally in your browser — nothing is uploaded.
FAQ
How do I use the generated gradient?
Paste the output background line into your element styles, e.g. .btn { background: linear-gradient(...); }.