WCAG 2.2 · 1.4.1 Use of Color
Colour blindness check
Enter the colours of a chart, a status label or a brand palette. You see them the way people with the four main types of colour blindness see them, and which ones they cannot tell apart.
This tool needs JavaScript. Without it, the rule of thumb: never use colour as the only way to show something.
| Vision | How your colours look | Hard to tell apart |
|---|
Who sees colour differently
About 1 in 12 men and 1 in 200 women have a colour vision deficiency. In a lecture hall of 100 students, that is usually around four people. Most of them are not fully colour blind: certain colours simply look much more alike to them.
- Deuteranopia (green cones): the most common type. Red, green, orange and brown are easy to confuse.
- Protanopia (red cones): also red–green, and red looks darker, close to black.
- Tritanopia (blue cones): rare. Blue and green, and yellow and pink, look alike.
- Achromatopsia: very rare, no colour at all. Only lightness is left, which is also how your page looks in grayscale mode or on a black-and-white print.
What WCAG says
Success criterion 1.4.1 Use of Color (level A, the basic level) says colour must never be the only way to show information. A red error field also needs an icon or text. A line chart also needs labels or different line styles. A link in a paragraph also needs an underline. Then it does not matter which colours someone can see.
This tool helps you find where colour alone is not enough. A warning here does not mean you cannot use those colours. It means you need a second signal, such as text, an icon, a pattern or a clear difference in lightness.
How the simulation works
The tool converts your colours to linear light and applies the colour-vision model of Machado, Oliveira and Fernandes (2009), at full severity, to simulate each type. It then measures the difference between every pair of colours in OKLab, a colour space built to match how we see. If two colours end up closer than 0.06 there, they are marked as hard to tell apart. A simulation is an approximation: real colour vision differs from person to person.