A color palette generator with the math already done.
Four free color tools built on real color science. No sign up, and every result has a link you can share.
6 of 20 pairs carry body text analogous, spaced in OKLCH base from Ash Rose
Live, not a screenshot. Click any swatch to copy it.
Free color tools for designers and developers
Generate a color scheme, check WCAG contrast, convert hex codes to RGB or OKLCH, and build CSS gradients. The tools share one color parser, so a value from one drops straight into the next.
Color Palette Generator
Build a color scheme from one color, then lock the swatches you like.
Color Contrast Checker
Check WCAG 2.2 contrast ratios and APCA, and get a fix when a pair fails.
Color Converter
One value in, every format out: HEX, RGB, HSL, LAB, LCH, OKLCH and CMYK.
CSS Gradient Generator
Linear, radial and conic CSS gradients with as many color stops as you need.
Start from a curated color palette
Ready to use color palettes with hex codes, each checked for how much of it can actually carry text. Open one in the generator and change whatever you like.
Not a hue wheel with a coat of paint
Palettes are spaced in OKLCH, so the lightness rhythm matches what the eye sees rather than what HSL claims. Contrast is reported both as the WCAG 2.2 ratio you need for compliance and as the APCA Lc score that predicts real readability. Every result includes a color vision simulation, because roughly one man in twelve does not see your palette the way you do.
How the math worksWorked example: why HSL lightness is not lightness
Numbers are measured relative luminanceHSL, every swatch at 50% lightness spread 42 points
OKLCH, every swatch at the same perceptual lightness spread 4 points
Latest color theory articles
Working notes on the decisions that actually come up: how many colors a system needs, why your gradient looks dirty, and when the textbook rule is wrong.
Warm and cool colors: the myth of color temperature
Blue is cool and red is warm, except that physically it is the exact reverse, and the associations are less universal than the design textbooks suggest.
Color blind friendly design: palettes that work for everyone
Roughly one man in twelve does not see your palette the way you do. The fix is not a beige interface. It is making sure color is never the only thing carrying the message.
How many colors does a website color palette need?
Fewer than you think, and more than you planned. The gap between 'a palette' and 'a color system' is where most projects lose control.