Colour Blindness Simulator

How to use

1. Enter the two colours that carry different meanings in your design.
2. Read down the list: each row is the same pair as one form of colour vision sees it.
3. Anything marked hard to tell apart needs a second signal — a label, an icon, a shape.
4. Repeat for every meaningful pair, not just the brand colours.

Features

• Protanopia, deuteranopia, tritanopia and full achromatopsia.
• Contrast between the two colours reported for each, not just a picture.
• Flags a pair that collapses into one colour.
• Transforms applied in linear RGB, where the maths is actually defined.
• Runs entirely in your browser.

Frequently asked questions

What am I actually looking for?

Not whether the colours look nice — whether they still look like two colours. Red and green status dots are the classic failure: they are meaningfully different to most people and nearly identical to the one man in twelve with a red-green deficiency. If a row is flagged, the design needs something besides colour to carry that meaning.

How accurate is the simulation?

It is an approximation, and honestly so. These matrices model the three complete dichromacies — people who lack one cone type entirely — while most colour vision deficiency is anomalous trichromacy, a shifted rather than absent response, which varies from person to person. A pair that survives here is probably fine; a pair that fails here definitely needs work.

Is enough contrast sufficient on its own?

For text against a background, contrast is the standard and this shows it. For two colours that mean different things, contrast is necessary and not sufficient: a colourblind reader can see that two dots differ in lightness and still not know which is the error. Add a label or a shape.

Related tools