Color blindness simulator
Simulate how any color or palette appears to people with protanopia, deuteranopia, tritanopia and achromatopsia. Build truly accessible designs. Free, instant, browser-only.
- HEX
#47003a- RGB
- rgb(71, 0, 58)
- HSL
- hsl(311, 100%, 14%)
- OKLCH
- oklch(0.27 0.119 337.9)
Simulation results
Normal vision
#47003AFull trichromatic color vision
Protanopia
#000E3DNo red cones (~1.3% of males)
Deuteranopia
#0D1737No green cones (~1.2% of males)
Tritanopia
#4F0312No blue cones (~0.01% of population)
Achromatopsia
#131313Total color blindness (~0.003%)
Simulations use the Machado et al. (2009) matrices — the same transform used by major accessibility tools. Roughly 8% of men and 0.5% of women have some form of color vision deficiency.
Want the full design system from a color? Open the color palette generator to create accessible palettes, semantic tokens, light and dark themes, and production-ready CSS — all from a single color.
How to use this tool
- Enter or pick a color in HEX, rgb() or hsl() format.
- The tool instantly shows how that color appears under each type of color blindness.
- Use the results to choose palettes that work for everyone — not just people with full color vision.
Frequently asked questions
- What types of color blindness does this simulate?
- Four types: protanopia (no red cones), deuteranopia (no green cones), tritanopia (no blue cones), and achromatopsia (total color blindness). Each uses peer-reviewed transformation matrices.
- How accurate is the simulation?
- The matrices are based on published research from Machado et al. (2009) and are the same ones used by major accessibility tools. They model the most common forms of each condition.
- Why does color accessibility matter?
- Roughly 8 % of men and 0.5 % of women have some form of color vision deficiency. If your interface relies on color alone to convey meaning, those users may be excluded. This tool helps you catch those issues early.