Drop an image here
or click to choose · PNG, JPG, WebP, GIF
Choose imageAbout the Color Blindness Simulator
Preview any image the way a colour-blind viewer would see it. Upload a design, chart or photo and switch between four simulations — protanopia (red-blind), deuteranopia (green-blind), tritanopia (blue-blind) and achromatopsia (total colour blindness) — with a normal-vision view for comparison. Each mode recolours the image using an established transformation matrix and can be downloaded as a PNG for documentation.
Roughly one in twelve men and one in two hundred women has some form of colour vision deficiency, so a chart whose red and green lines are distinguishable only by hue quietly excludes a chunk of its audience. Designers run UI mockups, maps and data visualisations through this simulator to catch such traps early. Everything renders locally in the browser — unpublished designs stay private.
Features
- Four deficiency simulations plus a normal-vision baseline
- Protanopia, deuteranopia, tritanopia and achromatopsia covered
- One-click switching to compare conditions quickly
- Download any simulated view as a PNG
- Works on charts, UI screenshots, maps and photos
- Simulated entirely in-browser — designs are never uploaded
How to test an image for colour blindness online
- Upload the design, chart or screenshot you want to check.
- Click Protanopia or Deuteranopia — the most common deficiencies.
- Look for elements that become hard to tell apart.
- Cycle through Tritanopia and Achromatopsia as well.
- Download simulated views to share with your team.
Frequently asked questions
Which types of colour blindness does the simulator cover?
Four conditions: protanopia (missing red receptors), deuteranopia (missing green receptors), tritanopia (missing blue receptors, which is quite rare) and achromatopsia (a complete absence of colour vision, rendered as grayscale). Deuteranopia and protanopia together account for the vast majority of real-world colour vision deficiency, so check those two first.
How accurate are these simulations?
Each mode applies a widely used colour transformation matrix that approximates how the deficiency shifts perceived colours. Individual perception varies — many people have partial rather than total deficiencies — so treat the output as a strong directional guide for design decisions rather than a clinical reproduction.
Why should designers test images for colour blindness?
About 8% of men and 0.5% of women see colour differently, and the classic failure — red versus green as the only distinction between chart series, form errors or map zones — is invisible until someone affected can't use your work. Simulating early lets you add labels, patterns or safer palettes cheaply.
What should I do if my design fails the test?
Don't rely on hue alone: add text labels, icons, patterns or brightness differences alongside colour. Choose palettes that vary in lightness as well as hue — blue/orange pairs survive most deficiencies far better than red/green. Re-run the simulation after each change to confirm the fix.
Can I save the simulated images?
Yes — whichever simulation is active can be downloaded as a full-resolution PNG, which is handy for accessibility reports, design reviews and tickets. Since the recolouring happens in your browser, both the original and the simulated versions remain entirely on your machine.