How to Use
- 1
Upload an image of your design, screenshot, or any visual.
- 2
Switch between simulation modes: Protanopia (red-blind), Deuteranopia (green-blind), Tritanopia (blue-blind), and Achromatopsia (total color blindness).
- 3
Compare the original and simulated views side by side to identify accessibility issues.
Frequently Asked Questions
What types of color blindness are simulated? โผ
Protanopia (reduced red sensitivity, affecting ~1% of males), Deuteranopia (reduced green sensitivity, ~1% of males), Tritanopia (reduced blue sensitivity, rare), and Achromatopsia (no color perception, very rare).
Why does this matter for design? โผ
About 8% of males and 0.5% of females have some form of color vision deficiency. Checking your designs ensures they are usable and readable for all users, which is also a WCAG accessibility requirement.
Is my image uploaded to a server? โผ
No. The simulation uses CSS filter matrices and Canvas API entirely in your browser.