Advanced Gradient Generator

Linear · Radial · Conic · Presets · Export PNG · Blend Modes

Type

90°
Color Stops
Advanced: Blend Mode & More
Favorites
Presets (15+)

Preview

Generated Code

background: linear-gradient(90deg, #06b6d4 0%, #3b82f6 100%);
🔒 Is my data private?
Yes, 100% client-side. No server upload.
🎨 What gradient types?
Linear, radial, conic. Adjust angle & position.
🖌️ How to add colors?
Click "+" to add stops, drag to adjust position.
💾 Export options?
PNG, share link, CSS, SCSS, Tailwind-ready.
📦 Blend modes?
Overlay, screen, multiply etc. for creative effects.
⭐ Favorites?
Save custom gradients for quick access.
Ready