Linear · Radial · Conic · PNG + SVG + CSS export
Gradient Generator
Build multi-stop gradients visually. Download as CSS, Tailwind config, SVG, or PNG.
Export
style.css
.gradient {
background: linear-gradient(135deg, #6366F1 0%, #EC4899 100%);
}°
Colour stops
Drag handles · click track to add
%
%
More Color Tools
Continue exploring — all tools are free, no sign-up needed
Mixing Lab
Mix and blend colours to create the perfect shade
Try it
Image → Palette
Extract a harmonious palette from any photo
Try it
Contrast Checker
Verify WCAG AA / AAA accessibility in seconds
Try it
Tints & Shades
Generate a full 50–950 colour scale from any hex
Try it
Colour Blindness Simulator
Preview palettes as seen by colour-blind users
Try it