See your colors as people with protanopia, deuteranopia or tritanopia see them, using the peer-reviewed Machado (2009) simulation matrices with adjustable severity. For palettes it identifies the hardest-to-distinguish pair under each simulation — the pair most likely to fail real users.
Settings
Generated locally in your browser — your settings and results never leave this page.
Designing for the vision you do not have
Roughly one in twelve men and one in two hundred women see color differently than the design population that chooses UI palettes — overwhelmingly along the red-green axis. No amount of squinting simulates that experience; simulation mathematics does. This tool renders your actual colors under the three dichromatic conditions plus grayscale, turning “is this okay for color-blind users?” from speculation into inspection.
The simulation’s credentials and limits
Transforms are the Machado, Oliveira & Fernandes (2009) matrices — peer-reviewed, physiologically modeled, the standard in serious tooling — applied in linear RGB with a severity blend for the anomalous-trichromacy majority of real cases. Honesty clause: any simulation approximates another person’s perception; results are excellent for design decisions (will these separate?) and inappropriate for clinical claims. The tool’s reports carry the citation so your audit trail does too.
The hardest-pair report is the headline
For palettes, per-color simulation is scenery; the decision-driver is the pairwise minimum: which two of your colors become most similar under each condition, and how similar. The report names the pair and its post-simulation ΔE — below roughly 9, assume confusion. That single number per condition converts an aesthetic review into an engineering check with a threshold.
Fixes that actually work
When a pair collapses: separate by lightness (survives every condition — darken one member, done); swap one hue out of the confusion axis (red↔orange↔olive conflicts resolve toward blue); or stop relying on color alone — icons, labels, patterns, position. The last is not a fallback but the standard: WCAG 1.4.1 requires meaning to survive without color regardless of palette quality. The simulator tells you where that requirement is currently doing heavy lifting.
Severity: the forgotten dimension
Full dichromacy — the 100% setting — is actually the minority of the minority: most affected users are anomalous trichromats whose cone response is shifted, not absent, experiencing something between the simulation’s extremes. The severity slider models that continuum, and checking at 60% as well as 100% is the difference between designing for the textbook case and designing for the population. A palette that only fails at 100% severity fails few users; one that fails at 60% fails many.
The slider also earns its place in stakeholder conversations: watching a chart’s series merge gradually as severity rises communicates the design constraint more persuasively than any static comparison — the standard demo this page was built to give.
How to use the Color Blindness Simulator
- Paste one or several colors.
- Set severity – 100% simulates full dichromacy.
- Compare the original strip with protan, deutan, tritan and grayscale views.
- For palettes, check the hardest-pair report.
Frequently asked questions
What do protanopia, deuteranopia and tritanopia mean?
Absence of one cone type: protanopia the long-wave (red) cones, deuteranopia the medium (green), tritanopia the short (blue). Protan and deutan both collapse red-green distinctions (together ~8% of men); tritan, much rarer, confuses blue-yellow. The simulator renders each so you see your colors through those eyes.
How accurate is the simulation?
It applies the Machado, Oliveira & Fernandes (2009) matrices – peer-reviewed, widely used in accessibility tooling – in linear RGB with adjustable severity. Simulations approximate dichromat perception; they are excellent for design decisions and honest enough to say they are not ground truth.
What is the "hardest pair" report for palettes?
For each deficiency type, the two palette colors whose simulated versions are closest in ΔE – the pair most likely to be confused. Under 9 or so, assume those users cannot reliably separate them, and add a non-color cue or change one color.
Why does the severity slider exist?
Because most affected people are anomalous trichromats – shifted, not missing, cone response. Partial severity blends the matrices toward normal vision, approximating the milder (and far more common) forms. Test at 100% for the floor, ~60% for the median experience.
Red and green look different to me even in the deutan view – why?
Because typical reds and greens also differ in lightness, which survives. What collapses is the hue distinction alone. That is the design lesson in one sentence: encode with lightness and hue together and every vision type keeps the signal.
What does the grayscale row test?
Total color removal – both the rare achromatopsia case and the everyday scenarios: grayscale printing, e-ink, night modes. If information survives the grayscale row, it survives everything above it too.
Which color pairs should never carry meaning alone?
The classics: red/green (status!), orange/lime, cyan/gray, purple/blue under tritan. If your status system is exactly red=bad/green=good, add icons or labels – the pair is invisible to the largest CVD group, and this simulator will show you exactly how.
Build a palette that stays accessible
A palette with its contrast checked and its behaviour under colour blindness known.
- Online Color PickerSettle on the base colour to build everything else from.
- Color Palette GeneratorGenerate a full palette around that base.
- Palette Contrast MatrixSee every foreground and background pairing at once.
- Color Blindness Simulator you are hereCheck the palette still reads for common types of colour blindness.
