Last updated
Types of Color Blindness
Color blindness (color vision deficiency) affects approximately 8% of males and 0.5% of females. It's caused by missing or malfunctioning cone cells in the retina. The most common type is red-green color blindness. Designing for color blindness means ensuring information is conveyed through more than just color.
Color Vision Deficiency Types
| Type | Prevalence | Affected Colors |
|---|---|---|
| Deuteranopia | ~1% males | Red-green (no green cones) |
| Protanopia | ~1% males | Red-green (no red cones) |
| Tritanopia | ~0.01% | Blue-yellow (no blue cones) |
| Deuteranomaly | ~5% males | Reduced green sensitivity |
| Protanomaly | ~1% males | Reduced red sensitivity |
| Achromatopsia | ~0.003% | No color vision (monochromatic) |
Simulating Color Blindness with CSS
CSS
/* Simulate deuteranopia (red-green color blindness) */
.simulate-deuteranopia {
filter: url('#deuteranopia');
}
/* SVG filter for deuteranopia simulation */
/* Place in HTML: */
/* <svg style="display:none">
<defs>
<filter id="deuteranopia">
<feColorMatrix type="matrix" values="
0.367 0.861 -0.228 0 0
0.280 0.673 0.047 0 0
-0.012 0.043 0.969 0 0
0 0 0 1 0"/>
</filter>
</defs>
</svg> */