◑Colour Blindness Simulator

There is one rule, and everything else on this page is detail: never let colour be the only thing carrying meaning.

If your form marks errors in red and nothing else changes, roughly one man in twelve cannot reliably see which field is wrong. Add an icon, a label, a border weight — anything that survives the colour being removed — and the problem disappears entirely.

What the four simulations show

Protanopia and deuteranopia both affect red-green perception and account for the overwhelming majority of cases. This is why red and green status indicators are such a persistent problem, and why a red delete button next to a green save button is worse than it looks.

Tritanopia affects blue-yellow discrimination and is rare. Achromatopsia removes colour entirely; it is rarer still, but it doubles as a useful proxy for how your interface survives a greyscale print or a screenshot pasted into a black-and-white document.

Using it properly

The single-colour view is less useful than it looks. The real question is almost never how one colour appears — it is whether two colours stay distinguishable. Enter a second colour and compare the pair; that is the test that finds actual failures.

Worth checking: chart series colours, status badges, before-and-after states, and any two-colour system where the difference means something.

What this cannot do

These are matrix approximations of cone response, not medical simulations, and colour vision deficiency varies between individuals. Use them to catch obvious failures, not to certify a palette as accessible.

They also answer a different question from the contrast checker. Contrast measures light against dark, which is what makes text legible. This measures whether two hues stay apart. A pair can pass one and fail the other, so check both.