Color Blindness Simulator
See how a color appears to people with color vision deficiencies.
| Type | Â | Â | Â | Â | Â | Â | Â | Â |
|---|---|---|---|---|---|---|---|---|
| Original | #e53935 | #43a047 | #1e88e5 | #fdd835 | #fb8c00 | #8e24aa | #00acc1 | #6d4c41 |
| Protanopia (red-blind) | #9b9936 | #6b6c5d | #4c4dce | #eded5c | #cbca22 | #605f8a | #4a4cbc | #5f5e44 |
| Deuteranopia (green-blind) | #a5b136 | #665f62 | #463ec9 | #eff266 | #d1da2a | #666e82 | #4134bb | #616344 |
| Tritanopia (blue-blind) | #dc3737 | #486e71 | #23bdb9 | #fb7c82 | #f53d43 | #89706a | #09b8b7 | #6b4646 |
| Achromatopsia (monochrome) | #6c6c6c | #7a7a7a | #737373 | #d0d0d0 | #9d9d9d | #535353 | #7b7b7b | #555555 |
Simulate Color Blindness
About 1 in 12 men and 1 in 200 women have some form of color vision deficiency. This simulator shows how a color appears under the most common types, helping you design interfaces and graphics that everyone can read.
The common types
- Protanopia â reduced red sensitivity
- Deuteranopia â reduced green sensitivity
- Tritanopia â reduced blue sensitivity
- Achromatopsia â no color (monochrome)
Design takeaways
Never rely on color alone to convey meaning. Pair color with text, icons, or patterns, and ensure sufficient contrast so information survives any kind of color vision.
How it works
The simulation applies established color-transformation matrices to approximate how each deficiency shifts perceived color. These are close approximations, not medical-grade reproductions, but they are reliable for design decisions. Everything runs in your browser.
Frequently Asked Questions
Common questions about the Color Blindness Simulator.