Color Blindness Simulator
See how colors and images appear to people with protanopia, deuteranopia, tritanopia, or full color blindness. Essential accessibility tool for designers.
Normal Vision ↑
Protanopia
Deuteranopia
Tritanopia
Achromatopsia
How to Use the Color Blindness Simulator
Upload an image, screenshot of your design, or paste a color palette. The tool renders side-by-side previews showing how it appears with normal vision and with the four major color vision deficiencies. Toggle between simulation types to spot which elements lose meaning for each condition.
The Four Conditions Simulated
Protanopia (red-blindness): reds appear dim and green-yellow. Deuteranopia (green-blindness): reds and greens are difficult to distinguish — the most common form. Tritanopia (blue-blindness): blues and yellows are confused; very rare. Achromatopsia (total color blindness): everyone sees only grayscale — extremely rare but worth designing for as a worst case.
Common Design Pitfalls Color Blindness Reveals
Red-green status indicators (the classic "error red" + "success green") are invisible to roughly 8% of male users. Pie charts that rely only on color to differentiate segments become unreadable. "Click the red button" instructions fail. Heat maps that go red → yellow → green lose their entire scale. The simulator surfaces these problems immediately, while your design is still cheap to change.
Fixing Color-Blindness Issues
Add a second visual signal beyond color: icons next to error/success messages (✗ vs ✓), patterns or labels on chart segments, text labels on dashboards, distinct shapes for graph markers. Choose color pairings with high luminance contrast in addition to hue difference — even if the hue is lost, the brightness difference still distinguishes them. Run the final design through our contrast checker to confirm.