See a real photo, a UI mockup, or a whole palette the way roughly 1 in 12 men actually see it — not just one swatch behind a toggle.
Browse CSS lessonsAt 100% this shows the full "blind" form (protanopia, deuteranopia, tritanopia). Below 100% it shows the far more common "weak" form (protanomaly, deuteranomaly, tritanomaly) — most red-green colour vision deficiency is this partial kind, not total.
Prevalence: protanopia + protanomaly together: roughly 2% of men, about 0.03% of women
Prevalence: deuteranopia + deuteranomaly together: roughly 6% of men — the single most common form — about 0.4% of women
Prevalence: roughly 1 in 10,000 people, split about evenly between men and women (not X-linked, unlike red-green CVD)
Prevalence: roughly 1 in 30,000 people — very rare, affects all sexes about equally
The image and palette panels simulate in linear light (gamma-decoded, matrix-transformed, gamma-encoded) for accuracy — naive maths directly on sRGB values, a common shortcut in colour-blind simulators, visibly skews the result. The copyable SVG filter is built differently, directly on sRGB with no gamma step, because that’s genuinely what a real filter: url(#id) does in a browser — matching what you’d actually get matters more there than matching the more accurate simulation.
The exact CSS you could apply live — filter: url(#id) — to preview this condition on your own site, the same technique Chrome DevTools’ own "Emulate vision deficiencies" uses.
Protanopia
Missing or weakened L ("red") cones. Reds read darker and can be confused with black, brown, or dark green; red and green traffic-light-style cues are the classic failure case.
Deuteranopia
Missing or weakened M ("green") cones — the single most common form of colour vision deficiency by far. Greens and reds both shift toward a similar brownish-yellow, which is why red/green status indicators are the most commonly cited accessibility failure.
Tritanopia
Missing or weakened S ("blue") cones. Rare, and unlike protan/deutan it isn’t X-linked, so it affects men and women about equally. Blue and green become hard to tell apart, and yellow can look pink.
Achromatopsia
No functioning cones at all — vision is entirely rod-based, effectively true grayscale, often alongside severe light sensitivity and low visual acuity. Very rare; total colour blindness in the everyday sense of the phrase is almost always actually one of the types above, not this.