Color Blindness Simulator
Upload an image or paste a URL to see how it appears under 8 types of color vision deficiency: Protanopia, Protanomaly, Deuteranopia, Deuteranomaly, Tritanopia, Tritanomaly, Achromatopsia, and Achromatomaly. Uses the Brettel/Viénot/Mollon algorithm for accurate simulation.
Why This Matters
About 1 in 12 men (8%) and 1 in 200 women (0.5%) have some form of color vision deficiency. If your website relies on color alone to convey information, a significant portion of users may miss it. WCAG 2.1 requires that color is not the only means of conveying information (1.4.1).
How to Use This Tool
- 1
Upload an image
Drag and drop or select an image file (PNG, JPG, GIF, WebP).
- 2
Choose a vision type
Select from 8 types: Protanopia, Protanomaly, Deuteranopia, Deuteranomaly, Tritanopia, Tritanomaly, Achromatopsia, Achromatomaly.
- 3
Adjust severity
Use the severity slider to simulate partial color vision loss.
- 4
Download or copy CSS
Download the simulated image as PNG or copy CSS filter variables for your stylesheet.
Frequently Asked Questions
What is Daltonize?
Daltonize is a technique that shifts color information lost in a particular type of color blindness into color channels the person can still see. It helps colorblind viewers distinguish colors they would otherwise confuse.
What's the difference between -opia and -omaly?
'-opia' (e.g., Protanopia) means complete absence of a cone type. '-omaly' (e.g., Protanomaly) means weakened sensitivity. The severity slider lets you simulate the full range from mild anomaly to complete dichromacy.
Does this tool process my image on a server?
No. All image processing happens in your browser using Canvas. Your images are never uploaded to any server.
What is the CSS variable output?
The tool generates CSS filter variables that you can apply to any element on your website to simulate color blindness in real-time, without needing to process images.