Instantly preview how any color or palette appears to people with different types of color vision deficiency. Useful for designers, developers, and accessibility auditors.
Color Input
Simulation Results
Colors are approximated using the Vienot/Brettel algorithm. Results are visual estimates, not medical definitions.
Accessibility Tips
Designing for Color Vision Deficiency
- Never rely on color alone to convey meaning — use labels, patterns, or icons alongside color.
- Ensure sufficient contrast between adjacent colors (aim for WCAG AA: 4.5:1 for text).
- Avoid red-green combinations as the primary distinguishing factor in charts or UI.
- Use colorblind-friendly palettes (e.g., Okabe-Ito, IBM Carbon, or Colorbrewer) for data visualization.
- Test your designs with a simulator — tools like this one cover the most common deficiency types.
- Add texture or pattern fills to charts in addition to color coding.
- Provide alternative text descriptions for color-coded information.
Color Vision Deficiency Statistics
| Type | Description | Affected (approx.) |
|---|---|---|
| Deuteranopia | Green cone absent (red-green) | 1% of males |
| Protanopia | Red cone absent (red-green) | 1% of males |
| Deuteranomaly | Green cone shifted (most common) | 5% of males |
| Protanomaly | Red cone shifted | 1% of males |
| Tritanopia | Blue cone absent (blue-yellow) | ~0.003% (all) |
| Tritanomaly | Blue cone shifted | ~0.01% (all) |
| Achromatopsia | No color vision (total) | ~0.003% (all) |
| Achromatomaly | Reduced color vision | Rare |
Source: Colour Blind Awareness. Male prevalence is higher for X-linked types (red-green). ~8% of males and ~0.5% of females have some form of color vision deficiency.
Check contrast ratios: Color Contrast Checker
Convert colors: Color Converter
Generate palettes: Color Palette Generator