Color Blindness Simulator
NewUpload an image and preview how it looks under protanopia, deuteranopia, tritanopia, and achromatopsia.
…or drag and drop an image here. Processed entirely in your browser.
Upload an image to see the simulation.
These are approximations using published color-vision-deficiency transform matrices (based on Brettel/Viénot-style linear RGB simulation), not a medically exact rendering of any individual's vision — actual severity varies by person. Protanopia and deuteranopia affect red/green perception, tritanopia affects blue/yellow perception, and achromatopsia is full color blindness (grayscale).
Frequently Asked Questions
What color vision deficiencies does this simulate?
Four conditions: protanopia and deuteranopia (both affect red/green discrimination, the two most common forms of color blindness, together affecting roughly 1 in 12 men), tritanopia (a rarer blue/yellow deficiency), and achromatopsia (complete color blindness, rendered as full grayscale).
How accurate is the simulation?
It uses published linear-RGB transform matrices commonly used in CVD simulation research and design tools — a solid approximation of how these conditions typically affect color perception. It is not a medically precise simulation of any one individual, since real-world severity varies from person to person.
Why would I run my UI or image through this?
Accessibility testing — if two elements (like a "success" green and an "error" red badge) become visually indistinguishable under protanopia or deuteranopia simulation, colorblind users likely can't tell them apart either, and you should add a non-color cue (icon, text label, pattern).
Does this upload my image anywhere?
No — the image is loaded into an in-memory canvas and processed entirely in your browser using JavaScript pixel manipulation. Nothing is uploaded to a server.
Can I simulate a solid color instead of an image?
This tool is built around image uploads so you can test real screenshots, mockups, or photos. For checking two specific colors against each other for contrast, pair it with the Color Contrast Checker tool instead.
Related Tools
ARIA Cheatsheet
NewAccessibility reference — ARIA roles, states, properties, and common accessible patterns.
Color Information
NewGet complete color info: HEX, RGB, HSL, HSV, CMYK, and color harmonies.
HTML Validator
NewValidate HTML structure for common errors, missing attributes, and accessibility issues.