visibility Color Blindness Simulator star

How Cone Cells and Color Vision Actually Work

Human color vision starts with three types of cone photoreceptor cells packed into the retina, each tuned to a different range of wavelengths: L-cones (long wavelength, peak sensitivity toward red-orange light), M-cones (medium wavelength, peak sensitivity toward green light) and S-cones (short wavelength, peak sensitivity toward blue-violet light). The brain does not see color directly — it compares the relative signal strength coming from these three cone types and reconstructs a color from that ratio. This three-channel model is why color science represents human vision as an "LMS" color space (Long, Medium, Short) rather than the RGB space a screen uses natively; every simulation in this tool converts your image from sRGB into LMS space first, because that is the space where a missing cone type can be modeled mathematically as a matrix that collapses one axis of the signal.

The specific matrices used here follow the Brettel, Viénot and Mollon (1997) approach as refined by Machado, Oliveira and Fernandes (2009), a widely cited and widely implemented method for simulating dichromacy (the two-cone-type condition). The pipeline is: sRGB → LMS via a fixed 3×3 transform, then a projection matrix per deficiency type that eliminates or reconstructs the missing cone signal from the other two, then LMS → sRGB to convert back to a displayable image. Protanopia is the absence or non-function of L-cones (red-sensing) — reds and greens collapse toward each other and reds appear darker than they should, because the L-cone signal contributes heavily to perceived brightness. Deuteranopia is the absence of M-cones (green-sensing) — a similar red-green confusion occurs, but without the darkening of reds, which is the main visual clue separating the two conditions. Tritanopia is the far rarer absence of S-cones (blue-sensing) — blues and greens become confusable, and yellows can appear pink, since the S-cone contributes almost nothing to brightness perception, so this deficiency does not darken any part of the image.

Achromatopsia, complete color blindness, is handled differently in this tool: rather than an LMS projection, it is computed with the standard ITU-R BT.601 luminance formula (gray = 0.299×R + 0.587×G + 0.114×B) applied to every pixel, the same weighting broadcast television has used since 1982 to convert color signals to grayscale for luminance, because it reflects how much each primary color contributes to perceived brightness. True achromatopsia — a total absence of functioning cones, leaving only rod-cell vision — is extremely rare and usually inherited; the vastly more common everyday term "color blind" almost always refers to red-green dichromacy or anomalous trichromacy, not this condition.

Why This Matters Beyond Curiosity

Color vision deficiency is not a fringe consideration. Red-green color blindness affects roughly 8% of men and about 0.5% of women of Northern European descent, a gap driven by genetics: the genes for L- and M-cone photopigments sit on the X chromosome, and the condition is recessive, so a man with a single affected X chromosome is colorblind, while a woman needs both her X chromosomes to carry the mutation. This X-linked recessive inheritance pattern is the same mechanism behind the male/female prevalence gap in hemophilia and is a textbook example taught in genetics courses worldwide.

• Design impact: the Web Content Accessibility Guidelines (WCAG) explicitly warn against using color as the only way to convey information — a red/green "invalid/valid" form indicator with no icon or text label is unreadable to a meaningful share of male users, which is why WCAG 1.4.1 requires a non-color cue alongside any color-coded meaning.
• Chart and map design: the classic red-to-green heatmap or the red/green line-chart pair are close to worst-case choices for color-blind readers; blue-orange palettes, distinct line patterns, or direct labeling remain legible across all four conditions this tool simulates.
• Not a diagnosis: this simulator approximates what a dichromat sees using population-average matrices; it cannot replace a clinical test like the Ishihara plates and severity varies between individuals even within the same named condition.
• Fully local: every pixel calculation happens on an HTML canvas in your browser — the photo you choose is never uploaded anywhere.