How is this different from the Colour Converter?

The converter is for reading one colour in many notations. The atlas adds the surrounding information, so you can judge whether the colour works before you use it.

Are the colour-blind previews medical?

No. They are standard simulation matrices, good for checking whether information survives without colour, not a diagnosis.

Does it upload my colour anywhere?

No, everything is computed in the page.

Colour Atlas

One colour opened up: every notation, its gamut, contrast, harmonies, tints and shades, and how it looks to colour-blind eyes.

Colour

Any notation

Poppy Red#E63946

Notations

HEX	#e63946
RGB	rgb(230, 57, 70)
Decimal RGB	rgb(0.9020, 0.2235, 0.2745)
HSL	hsl(355.5, 77.6%, 56.3%)
HSV	hsv(355.5, 75.2%, 90.2%)
LAB	lab(52.06 65.73 34.15)
LCH	lch(52.06 74.07 27.5)
OKLAB	oklab(0.6122 0.1927 0.0788)
OKLCH	oklch(0.6122 0.2082 22.2)
CMYK	cmyk(0%, 75%, 70%, 10%)
YCbCr	ycbcr(111, 108, 203)
Luminance	0.202

Atlas

Gamut (OKLCH)

Chroma: 0.208
Most in sRGB: 0.247
Used: 84%

Contrast

4.16:1 on whitePasses Large AA
5.03:1 on blackPasses AA, Large AA

Harmonies

Pick a swatch below to move the atlas to it.

Harmonies

Tints

Shades

Colour blindness

Protanopia#9b9a43
Deuteranopia#a5b242
Tritanopia#dd4040
Achromatopsia#6e6e6e

Runs in your browser; nothing you enter leaves this page.

How it works

A page for one colour

Enter any colour and the atlas fills in everything the other colour tools compute separately: notations, the chroma the colour uses against the most sRGB allows at its lightness and hue, contrast on white and on black, four harmonies, tints and shades, and simulated colour blindness.

Pick any swatch on the page to make it the new colour and the whole atlas moves to it.

Contrast and gamut

Contrast is the WCAG 2 ratio of relative luminance, listed with the levels it passes. Gamut compares your chroma with the largest chroma that stays inside sRGB at the same lightness and hue in OKLCH.

ratio = (L1 + 0.05) ÷ (L2 + 0.05)

More tools

All 238 tools