Color Blindness Simulator
About 8% of men and 0.5% of women have a color vision deficiency. Simulate how your palette looks to someone with protanopia, deuteranopia or tritanopia — with an adjustable severity slider and a live text preview. Everything runs in your browser.
Simulate your colors
| Original | Protanomaly (red-weak) | Deuteranomaly (green-weak) | Tritanomaly (blue-weak) | Remove |
|---|
Export the simulated palette
Live text preview
This is body text rendered with your chosen foreground and background colors, simulated for the selected vision type. If the text becomes hard to read here, it will be hard to read for roughly one in twelve male visitors.
Simulation uses color-vision-deficiency transforms applied in linear RGB space using the physiologically-based severity matrices of Machado, Oliveira & Fernandes (2009), with interpolation between severity levels. For hard WCAG numbers on a specific pair, use our contrast checker; for a full accessible palette, try the palette generator. To check an entire live page, run the free Accessibility Scanner.
Contrast under each vision type
The WCAG ratio between the two colors above, recomputed for each simulated vision type. A pair can pass for you and still fail for someone else — that is the difference a plain contrast check does not see.
Palette contrast under each vision type
Every pair in your palette, recomputed for each simulated vision type. A pair that passes for you can fail for someone else — this matrix shows which ones, so you can fix them before they reach a client.
Simulate an image, not just a swatch
Most real color problems live in a screenshot, a logo or a chart — not in two hex fields. Drop an image here and the same Machado model renders it for protanopia, deuteranopia and tritanopia at the severity set above. It is read in your browser with the canvas API; the file is never uploaded.
Or drag an image onto the panel, or paste one with Ctrl+V / ⌘+V. The severity slider above changes all four panels live.
No image yet — choose one above to see it through the three vision types.
What the three types mean
- Protanomaly — reds look darker and can vanish against green or grey.
- Deuteranomaly — the most common form; red and green become nearly indistinguishable.
- Tritanomaly — very rare; blue and yellow merge together.
Practical rule: never rely on hue alone to convey meaning. Pair color with icons, labels or patterns — that is also what WCAG SC 1.4.1 requires.
← All free tools · Palette generator · Contrast checker · Dansk version
The simulator shows the two colors you picked. It cannot see the page they shipped on.
The simulator is free, and it does the whole color-vision job: you choose two colors and the 2009 Machado model renders them for protanopia, deuteranopia and tritanopia. That does not change with a licence.
What no simulator can see is what actually got published. The free scanner already runs the 15 automated checks against a real URL — alt text, form labels, headings, contrast, ARIA, frames and tables — so a theme that shifts the contrast on a page you never touched still gets measured. EUComply Pro adds the GDPR/cookie and NIS2/security checks on top (18 more), so it becomes 33 checks in all: whether a privacy link exists, whether a page that really loads tracking is missing a consent banner, and whether HSTS and content security are set in the response. The report is a pdf report you can send on. $79/year per website.
| Plan | Free | EUComply Pro |
|---|---|---|
| What you get |
|
|
| Price | $0no licence key needed | $79/year per website |
Frequently asked questions
How accurate is the simulation?
The tool uses the standard Machado et al. (2009) severity model for protanopia, deuteranopia and tritanopia — the same matrices used in professional design tools. It approximates how colors are perceived, but only a clinical test can diagnose color vision deficiency in a person.
Are my colors uploaded anywhere?
No. The simulation runs entirely in JavaScript in your browser. Your palette never leaves your device.
Which type should I check against?
Deuteranomaly (red-green) is by far the most common, so start there. If your design works for deuteranopia and tritanopia, it will almost always work for rarer types too. Check both text contrast and chart/status colors.
Does this replace a WCAG contrast check?
No — they answer different questions. A contrast checker tells you whether text is readable; this simulator shows whether two hues remain distinguishable when color vision is impaired. Use both: contrast for legibility, simulation for color coding.