Color Blindness Simulator
Preview how your designs appear to people with color vision deficiency. Simulate protanopia, deuteranopia, tritanopia, and more. Upload images or test individual colors.
Drop image here or click to upload
Supports: PNG, JPG, WEBP, GIF (max 10MB)
Paste from Clipboard (Ctrl+V)
Or enter a color
About 8% of men and 0.5% of women have some form of color vision deficiency. Ensure your designs are accessible!
Embed This Tool
Add this tool to your website with customizable styling
How to Use
- 1 Upload an image by dragging and dropping, clicking to browse, or pasting from your clipboard (Ctrl+V). Alternatively, enter a hex color code to test individual colors.
- 2 Choose a view mode — Side-by-Side to compare original with one simulation, Grid to see all 8 types at once, or Single to focus on one type.
- 3 Select a color blindness type from the list. Start with Deuteranomaly (the most common) to test the broadest audience impact.
- 4 Review the simulation to see how people with this type of color vision deficiency would perceive your design.
- 5 Download your results — save the simulated image or a side-by-side comparison for documentation or team review.
💡 Tip: About 8% of men and 0.5% of women have some form of color vision deficiency. Deuteranomaly (green-weak) alone affects about 5% of males, making it the most important type to test for.
Frequently Asked Questions
What types of color blindness does this simulate?
This tool simulates 8 types of color vision deficiency: Protanopia (red-blind), Deuteranopia (green-blind), Tritanopia (blue-blind), Protanomaly (red-weak), Deuteranomaly (green-weak, most common), Tritanomaly (blue-weak), Achromatopsia (complete color blindness), and Achromatomaly (partial color blindness). The simulations use scientifically accurate color transformation matrices based on research by Brettel, Viénot, and Mollon.
How do I make my designs more accessible for colorblind users?
Use these strategies: Don't rely on color alone — add text labels, icons, or patterns to convey meaning. Ensure sufficient contrast — use our Contrast Checker tool. Test with this simulator — especially Deuteranomaly as it's most common. Use colorblind-safe palettes — blue/orange combinations often work better than red/green. Add alternative visual cues — underlines for links, borders for selected items, icons for status indicators.
Is my image data private?
Yes, completely! All image processing happens entirely in your browser using the Canvas API. Your images are never uploaded to any server. The simulations are calculated locally on your device, making this tool safe for testing confidential designs or proprietary work.
What's the difference between "-anopia" and "-anomaly" types?
The "-anopia" suffix (like protanopia) indicates complete absence of certain color receptors — these people cannot see that color spectrum at all. The "-anomaly" suffix (like protanomaly) indicates reduced sensitivity — these people can see the colors but perceive them differently or with less distinction. Anomalies are more common and typically less severe than their -anopia counterparts.
⚠️ Note: This simulator provides an approximation of how colors appear to people with color vision deficiency. Individual experiences may vary. For critical applications, consider consulting with colorblind users directly.