Color Blindness Simulator

See your designs, charts, maps and photos the way people with colour vision deficiency see them, and check that nothing important depends on colour alone.

NewFreeNo upload9 vision types
1Upload an image
2Type of colour blindness
3View

How to use Color Blindness Simulator

  1. 1

    Upload an image

    Drop a screenshot, chart, UI design, map or photo, or try the sample chart.

  2. 2

    Choose a type

    Pick protanopia, deuteranopia, tritanopia, achromatopsia or a weaker anomaly with adjustable severity.

  3. 3

    Compare and export

    Use the slider, side by side or all-types view, and download the simulation or a comparison sheet.

Why simulate colour blindness?

About 1 in 12 men and 1 in 200 women have some form of colour vision deficiency. Red and green are the colours most often confused, which affects charts, maps, status colours, buttons and error messages. Checking your work with a simulator shows where information gets lost, so you can fix it before it reaches real users.

Types of colour vision deficiency

  • Deuteranomaly (weak green cones) is the most common type, affecting about 5% of men. Deuteranopia means the green cones are missing.
  • Protanomaly and protanopia affect the red cones. Reds look darker and are easily confused with greens and browns.
  • Tritanomaly and tritanopia affect the blue cones and are very rare. Blues and greens, and yellows and pinks, get confused.
  • Achromatopsia is complete colour blindness: everything is seen in shades of grey.

How the simulation works

The simulator uses the physiologically based model by Machado, Oliveira and Fernandes (2009), applied in linear RGB for accurate results. Anomalous types (the "-anomaly" variants) are simulated by blending between normal vision and full dichromacy, with severity you can adjust. Achromatopsia uses the luminance of each pixel. All processing happens in your browser.

Design tips for colour-blind accessibility

  • Never use colour as the only way to show information: add labels, icons, patterns or text.
  • Avoid red and green pairs for meaning (good/bad, on/off); blue and orange is a safer pair.
  • Keep strong lightness contrast between colours, not just different hues. Check text with our Contrast Checker.
  • Use direct labels on charts instead of colour-only legends.

Frequently asked questions

What is the most common type of colour blindness?
Deuteranomaly, a weakness of the green cones, affecting about 5% of men. Red-green deficiencies together affect about 8% of men and 0.5% of women.
How accurate is this simulator?
It uses the Machado et al. (2009) model, one of the most widely used scientific models, applied in linear RGB. Individual experience varies, so treat it as a strong guide, not a diagnosis.
What does severity mean?
For the -anomaly types the cones still work but are shifted. Severity blends between normal vision (0%) and full dichromacy (100%).
Can I check a website or app design?
Yes. Take a screenshot and upload it, or paste it with Ctrl+V. The all-types view shows every deficiency at once.
Is this a colour blindness test?
No. It simulates how images look to others. For a diagnosis, see an eye care professional.
Is my image uploaded?
No. The simulation runs entirely in your browser.

Related tools

Contrast CheckerImage Color AnalyzerColour PaletteGrayscale