Color Blindness Simulator: Protanopia, Deuteranopia & Tritanopia
See how a color, or a small UI palette, shifts under three common color vision differences. A simulation for sighted viewers, not a test of your own eyes.
Short answer: pick a color below and this tool computes how it would appear to someone with protanopia (no functioning long-wavelength, "red", cones), deuteranopia (no functioning medium-wavelength, "green", cones) or tritanopia (no functioning short-wavelength, "blue", cones), using a published transformation matrix. It shows the simulated color as both a swatch and a hex code, and it does the same for a small four-color palette, so you can see where a design choice that looks fine to typical color vision quietly collapses into two nearly identical shades for someone else.
| Vision | Appearance | Simulated hex |
|---|---|---|
| Typical vision | ||
| Protanopia | ||
| Deuteranopia | ||
| Tritanopia |
Try a four-color palette
This is a simulation for people with typical color vision, not a diagnostic test of your own eyes. Your image is processed in your browser and never uploaded.
How to use this simulator
Pick a single color to see it rendered four ways: as a person with typical color vision sees it, and as it would appear under each of the three simulated deficiencies. Both a colored swatch and its hex code are shown for every row, since the hex text is what actually carries the information for anyone using a screen reader or printing the page. Below that, the four-color palette section pre-loads a common status-color set, error red, success green, an informational blue, and an amber highlight, so you can watch what happens to a real interface pattern rather than a single isolated swatch. Change any of the four colors and the simulated table below updates immediately.
This is a simulation, not a test
It is worth being direct about this: nothing on this page tests, diagnoses or screens your own color vision. The simulator answers a different question entirely: given a color, what would it probably look like to a person with a specific, well-studied kind of color vision difference? That is a statement about the color, run through a published model, not a measurement of you. If you are curious or concerned about how you personally see color, the right next step is a qualified eye-care professional, who can run a proper, standardized assessment. Our color vision differences awareness guide covers how common these differences are and why they are a normal part of human variation, not a defect.
The model behind it
This tool uses the transformation published by Machado, Oliveira and Fernandes (2009), a physiologically-based model built from electrophysiological data on cone responses. For each deficiency, the model provides a severity scale from 0 (typical vision) to 1 (complete absence of the affected cone type), and at severity 1 the model's own authors note that it becomes equivalent to full dichromacy, which is exactly what "protanopia," "deuteranopia" and "tritanopia" mean. That is the setting this tool uses throughout: full severity, one fixed 3-by-3 matrix per deficiency, multiplied directly against the color's red, green and blue channel values to produce the simulated color. It is a single matrix multiplication per swatch, which is what makes it fast enough to update live as you type.
Why a red/green palette is the classic trap
Red-green differences are, by a wide margin, the most common category of color vision difference, which is exactly why an "error is red, success is green" pattern is such a recurring accessibility complaint. Type the default palette above into the simulator and watch the Error and Success swatches under Protanopia and Deuteranopia: both shift toward a similar muted brown or olive, and the hex codes, not just the colors, move noticeably closer together. The fix is not a different pair of colors, since almost any red-green pair will eventually run into the same problem for someone. The fix is redundancy: an icon, a label, a position or a shape that carries the same meaning the color was carrying alone, so the message survives even when the hue does not. Our awareness guide covers this design principle in more depth, including how common these differences are across a typical audience.
Limitations
This simulation is a model, not a window into anyone's actual visual experience, and it has real edges worth knowing. It only simulates complete dichromacy at full severity; most people with a color vision difference have some degree of anomalous trichromacy instead, a partial shift rather than a missing channel, and this tool does not attempt to show that gradient. The underlying matrices assume average cone spectral sensitivities and standard display primaries, not your specific monitor's calibration or any individual's actual retina. For speed, the matrix is applied directly to the standard, gamma-encoded sRGB values you enter rather than first converting to linear light, which is the common implementation shortcut used by most browser-based simulators; a fully linear-light version would shift results slightly, mostly for very dark or very bright colors. And because every browser and screen renders sRGB a little differently, the swatch on your screen is an approximation of an approximation. Treat it as a design aid for catching obvious problems, not as a precise stand-in for anyone's eyes.
Experience color perception, for fun. In Hueddle, a daily puzzle, you spot the one tile that differs from its neighbors. It is an enjoyable way to experience your own color perception, and nothing more: it is not a test, screening or diagnosis of any kind.
Frequently asked questions
Is this simulator a color blindness test?
No. It simulates how a given color or palette would likely appear to someone with a color vision difference; it does not test, diagnose or screen your own vision in any way. If you have questions about how you personally see color, consult a qualified eye-care professional.
What is the difference between protanopia, deuteranopia and tritanopia?
Protanopia is the complete absence of functioning long-wavelength ("red") cones, deuteranopia the complete absence of medium-wavelength ("green") cones, and tritanopia the complete absence of short-wavelength ("blue") cones. Red-green types (protanopia and deuteranopia) are far more common than the blue-yellow tritanopia, which is rare in both sexes.
What method does this tool use?
The severity-1.0 transformation matrices from Machado, Oliveira and Fernandes (2009), "A Physiologically-based Model for Simulation of Color Vision Deficiency," applied directly to sRGB channel values. The authors' model unifies simulation of anomalous trichromacy and full dichromacy in one framework; this tool uses the full-severity, dichromacy-equivalent setting.
Why do the Error and Success colors look so similar under some settings?
Because red and green differences are the most common category of color vision difference, a red-green status pair is exactly the case these simulations were built to expose. Under protanopia and deuteranopia, both colors typically shift toward a similar muted brown or olive tone, which is why designers are advised never to let color alone carry status information.
Does this account for how severe someone's color vision difference is?
Not directly. This tool simulates complete dichromacy, the most severe case, for each of the three types. Most real color vision differences are milder, a partial shift in one cone's sensitivity rather than its complete absence, so an individual's actual experience is often less extreme than what this tool shows.
Related reading
- Color vision differences: an awareness guide: how common these differences are, and why they are normal human variation.
- How your eyes see color: cones & trichromacy: the three cone types this simulator's model is built on.
- Color contrast & WCAG ratios: the separate question of luminance contrast, checked with our contrast checker.
Sources: Machado, G. M., Oliveira, M. M. and Fernandes, L. A. F. (2009), A physiologically-based model for simulation of color vision deficiency, IEEE Transactions on Visualization and Computer Graphics 15(6), 1291 to 1298; National Eye Institute, Color Blindness; Colour Blind Awareness, Types of colour blindness.
Understand it, then train it. The daily games stay free forever. A Personal Pass adds progress tracking (trends plus export); Teacher and School tools let you assign it and follow a whole class. For teachers & self-learners →