Skip to content

CSS Gradient Generator

Visual gradient builder for linear, radial, and conic gradients. Copy the CSS and paste into your stylesheet.

Presets

Color Stops

0%
100%

CSS Output

background: #667eea;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);

Tailwind CSS

style={{ backgroundImage: 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)' }}