Palette
Test every pair in a palette at once, tune each color, and export the result as tokens. Press Space to shuffle the unlocked colors.
Paste hex/rgb/hsl (one per line), a CSS custom properties block, a Tailwind config snippet, or Figma/W3C design tokens JSON.
Generate from a harmony
Replaces the palette above with colors derived from a base hue. Contrast between the results shows up right away in the matrix below.
Want to pull colors from a photo instead? Try the Image Picker.
Locked colors are kept as-is.
Contrast matrix
Model
Click a cell for full details.