Generate by harmony, lock colors you want to keep, and verify contrast against light and dark text.

Shortcuts

Space · Ctrl Z/Y · + · 1–9

Blend two colors with native CSS color-mix() and inspect production-ready output.

CSS

color-mix()

Enter any supported color channel and convert it instantly across common color models.

Output

HEX · RGB · HSL · HSB · CMYK

Generate consistent darker and lighter steps from one base color.

Output

HEX · CSS

Check foreground and background combinations against common WCAG contrast thresholds.

WCAG

AA · AAA