Curbcut Free Accessibility Scan

Free Accessibility Tool

Color Blindness Simulator

Upload a screenshot and see it as people with protanopia, deuteranopia, tritanopia, or no color vision do. Spot what color-only cues hide.

  • Runs in your browser
  • Nothing uploaded
  • 4 CVD types
  • Machado 2009 model
PNG, JPG, or WebP. Try a screenshot of your homepage or a chart.

  • Original

    Typical color vision

  • Deuteranopia

    No green cones — most common (~6% of men)

  • Protanopia

    No red cones — reds darken

  • Tritanopia

    No blue cones — blue/yellow confusion

  • Achromatopsia

    No color vision — luminance only

Simulations use the Machado (2009) model. They approximate how colors may appear — they are not a medical assessment.

How to use the Color Blindness Simulator

  1. Upload an image. Choose a screenshot of your page, a chart, a form, or a design mockup. Nothing is uploaded — it stays in your browser.
  2. Compare the panels. View your image as seen with deuteranopia, protanopia, tritanopia, and achromatopsia, alongside the original.
  3. Find color-only information. Look for status colors, chart series, or links that become indistinguishable in any panel.
  4. Add a non-color cue. Fix any ambiguity by adding an icon, text label, pattern, or underline so meaning never relies on color alone.

How to use the simulator

Upload a screenshot of a page, a chart, a form, or a design mockup. The tool redraws it four ways — once for each major type of color vision deficiency — plus the original for reference. Compare the panels and ask: does any information disappear?

The classic traps are red/green status indicators (a red required-field asterisk, a green "in stock" dot), color-coded charts and maps, and links distinguished from body text by color alone. If those become ambiguous in the deuteranopia or protanopia panel, add a non-color cue.

Fixing what you find

The principle is WCAG 1.4.1: Use of Color — color can reinforce meaning, but it must never be the only way meaning is conveyed. Add an icon to status messages, label chart series directly, underline links, and pair color with text. None of these hurt your design; they make it legible to everyone, including the ~8% of men with a color vision deficiency.

More free accessibility tools

Frequently asked questions

How accurate is this simulation?

It uses the Machado, Oliveira & Fernandes (2009) model — a widely-used, physiologically-based approximation — applied in linear sRGB. It's a strong visual guide for design decisions, but it's a simulation, not a medical diagnosis, and individual color perception varies.

What am I looking for?

Information conveyed by color alone. If a red 'error' and green 'success' look identical under deuteranopia, or a chart's series become indistinguishable, you're failing WCAG 1.4.1 (Use of Color). The fix is to add a second cue: an icon, label, pattern, or text.

Is my image uploaded anywhere?

No. The image is processed entirely in your browser with the Canvas API and never leaves your device. You can use it on private mockups safely.

How common is color blindness?

About 1 in 12 men (8%) and 1 in 200 women have some form of color vision deficiency — deuteranopia and protanopia (red-green) are by far the most common. For a typical site that's a meaningful share of visitors.

A scan is the start, not the finish

Automated tools catch only 30–40% of WCAG issues. Get a free human-led scan and a real remediation plan that makes your site defensibly compliant.

Get your free accessibility scan See our audit