🛠️ Tools by xy
☕ Coffee
💙 Donate
🎨 Gradient Generator
Pick four colors, choose a direction, copy the CSS. Simple & trendy.
Controls
Direction / Type
to right
to left
to bottom
to top
45°
90°
135°
225°
circle at center
circle at top
circle at bottom right
ellipse at center
Color Stops (auto space)
Auto
Tight center
Even quarters
Randomize ✨
Rotate colors ↻
Copy CSS
CSS Output
Live Preview