Color codes
Click any value to copy it. CSS copies it ready for a stylesheet.
- HEX
- RGB
- CMYK
- HSB
- HSL
- HWB
- LAB
- LCH
- OKLAB
- OKLCH
- XYZ
- LUV
- Name
Shades, tints and more
Click a step to copy it. The arrow in its corner opens its own page.
Shades
Already as dark as it gets
Tints
Mixed with white
Tones
A gray can’t get any grayer
Hues
A gray has no hue to turn
Temperatures
The same at every temperature
Harmonies
Palettes built around this color. Open one in the generator to keep going.
- Copies the code. Arrow keys move between colors. Open in generator
Analogous
Its neighbors on the wheel, 30° to either side.
- Copies the code. Arrow keys move between colors. Open in generator
Complementary
The hue straight across the wheel.
- Copies the code. Arrow keys move between colors. Open in generator
Split-complementary
The two hues on either side of its opposite.
- Copies the code. Arrow keys move between colors. Open in generator
Triadic
Three hues spaced evenly, 120° apart.
- Copies the code. Arrow keys move between colors. Open in generator
Tetradic
Two opposite pairs, 60° apart.
- Copies the code. Arrow keys move between colors. Open in generator
Square
Four hues spaced evenly, 90° apart.
Contrast
How it holds up as text, and with text on it, by WCAG 2.2.
Similar colors
Named colors close to this one.