Color Blindness Simulator
Load an image or type a color code to compare how it appears with protanopia, deuteranopia, tritanopia, and achromatopsia. Use it to check whether chart lines, map colors, or button states can still be told apart. For choosing color combinations, see the Color Palette Generator.
🔒 Runs in your browser · Your data is never sent to a server
100% is full dichromacy. Lower values approximate milder anomalous trichromacy. It does not affect achromatopsia.
Check a color code
Original
/ Contrast ratio:
Protanopia (red-blind)
Reds look dark; red, green and brown are hard to separate
/ Contrast ratio:
Deuteranopia (green-blind)
Red, green, brown and orange are hard to separate
/ Contrast ratio:
Tritanopia (blue-blind)
Blue and green, yellow and pink are hard to separate
/ Contrast ratio:
Achromatopsia (no color)
Only differences in brightness are visible
/ Contrast ratio:
Check an image
You can also drag and drop an image file here
Original
Protanopia (red-blind)
Deuteranopia (green-blind)
Tritanopia (blue-blind)
Achromatopsia (no color)
The preview is scaled down to stay fast. The saved file is processed at full size.
How to use
- Type colors under "Check a color code", or choose an image file under "Check an image" (drag & drop also works).
- Adjust the "Severity (protan, deutan, tritan)" slider.
- Compare each simulated view with the original.
- For images, click "Save as PNG" under each view to download it.
Notes
- Results are an approximation from a standard simulation model (Machado et al. 2009). Real perception varies a lot between people, so this does not match everyone.
- The degree of color vision deficiency differs by person. Lowering "Severity (protan, deutan, tritan)" shows milder cases, as a linear interpolation estimate.
- Your display settings and ambient light also change how colors look.
- For a final design check, make sure information is also conveyed by shape, pattern, or labels, not by color alone.
- Images are limited to 25 MB and about 40 megapixels. The saved file is processed at full size, so large images can take a few seconds.
Glossary
Protan, deutan, tritan
Types of color vision deficiency named by which of the three cone cells is affected: protan (red), deutan (green), or tritan (blue). Protan and deutan are by far the most common.
Dichromacy and anomalous trichromacy
In dichromacy one of the three cone types is missing; in anomalous trichromacy it works but with shifted sensitivity. Anomalous trichromacy is usually milder.
Achromatopsia
Almost no color discrimination, so the world is seen by brightness alone. It is very rare.
Contrast ratio
The brightness ratio between two colors (1 to 21). WCAG recommends at least 4.5 for body text. Text stays readable when brightness differs, even if the hues look alike.
FAQ
Is the simulation the same as what people actually see?
It is an approximation from a standard model (Machado et al. 2009). Color vision varies a lot between individuals, even within one type, so treat it as a guide for design checks.
What is the difference between protan, deutan and tritan?
Of the three cone types, protan affects the red cone, deutan the green cone, and tritan the blue cone. Protan and deutan are by far the most common; tritan and total color blindness are rare.
What does lowering "Severity" do?
It linearly interpolates between the original color and full dichromacy to approximate milder color vision deficiency. 100% is full dichromacy, and it has no effect on achromatopsia.
Is my image uploaded to a server?
No. The image is processed with a canvas in your browser and never leaves your device.
Share this page