Gradient Generator
Linear, radial and conic CSS gradients with a live preview, editable colour stops, and 22 curated presets.
Gradient type
Color stops
CSS output
background: linear-gradient(135deg, #F59E0B 0%, #855300 100%);
Presets
Related tools
Color Converter
One value in — HEX, RGB, HSL, HSV, CMYK, Lab, OKLCH, CSS name and Tailwind out. Copy any format.
Contrast Checker
WCAG 2.1 ratio and WCAG 3.0 APCA Lc side by side, with a live preview and a fix suggestion when a pair fails.
Palette Generator
6 harmony modes from one base colour, including double-complementary. Export as CSS, SCSS, Tailwind or JSON.
Tints & Shades
A 10-step 50-900 scale for design tokens. Tints lighten, shades darken — never swapped.
Color Picker
A canvas hue/saturation/lightness picker with keyboard control and your last 10 colours.
Color Blindness Simulator
See any palette or image through 8 types of colour vision deficiency.
Image Color Extractor
Upload an image, get its 5 dominant colours — nothing leaves your browser.
Tailwind Color Mapper
Find the nearest Tailwind CSS v3 token for any colour, with the full family scale.
CSS Variables Exporter
Turn a list of named colours into CSS custom properties, SCSS, Tailwind config or JSON.