// design tool

CSS Gradient Generator

Create stunning linear, radial, conic, mesh gradients and pattern backgrounds with live preview.

Gradient Type
Direction / Angle
135°
Color Stops
Extra Options
100%
100%
🎨 Presets
Live Preview
background: linear-gradient(135deg, #7c5cfc, #00d4aa);
All CSS Formats
background-image
Tailwind CSS
React inline style