Color Blindness Simulator

Color blindness — more precisely color vision deficiency (CVD) — means some cone cells in the eye detect less difference between certain wavelengths of light. The most common forms make red and green hard to tell apart (deuteranopia / deuteranomaly and protanopia / protanomaly). Tritanopia and tritanomaly affect blue-yellow discrimination and are rarer. Achromatopsia is total color blindness (grayscale vision); achromatomaly is a partial loss of color saturation. This free color blindness simulator lets designers and developers preview how a brand color, chart, or screenshot may look under each type — instantly, with no upload to a server.

CVD is common: about 8% of men and roughly 0.5% of women worldwide. That is tens of millions of users who may not distinguish your red error state from a green success badge, or two lines on a analytics chart, if you rely on hue alone. WCAG and inclusive design practice say: use contrast, labels, icons, and patterns — not color by itself — to convey meaning. Simulating CVD is a fast sanity check before user testing. Search terms like color blindness simulator, colorblind checker, deuteranopia simulator, color vision deficiency, colorblind test image, and simulate color blindness all describe this workflow.

How the simulation works: For each deficiency type we multiply RGB values by a standard 3×3 transformation matrix derived from color vision research (Machado-style CVD simulation). Each output channel is a weighted mix of input red, green, and blue. For a single swatch you see the shifted hex immediately. For images we draw to a canvas, apply the matrix per pixel (with downsampling for large files so the page stays responsive), and show Normal plus every simulated type. This is the same mathematical approach used in many accessibility plugins and scientific visualizations — a practical approximation, not a medical diagnosis.

Protanopia vs protanomaly: Protanopia means missing or non-functioning L-cones (long wavelength / red). Protanomaly is a milder form — red sensitivity is reduced but not gone. Deuteranopia and deuteranomaly affect M-cones (green) and are the most frequent CVD types people mean when they say “red-green colorblind.” Tritanopia / tritanomaly involve S-cones (blue) and can make yellow and blue-purple pairs confusing. Designers checking traffic-light metaphors, heat maps, and status pills should simulate at least deuteranopia and protanopia; product teams serving global audiences often add tritanopia for completeness.

Use cases: UI designers validating button and link colors; data teams checking chart palettes; marketers reviewing infographics; developers testing dark mode accents; educators explaining accessibility to stakeholders. Pair this tool with our Contrast Checker for WCAG ratios, the Color Converter for format flexibility, and Palette Generator or Palette from Image when building accessible color systems. Everything runs client-side — your colors and images stay private.

Who needs this: Front-end engineers shipping dashboards, designers handing off Figma tokens, accessibility specialists auditing releases, students learning inclusive design, and anyone who has asked “will colorblind users see this?” without scheduling lab time. Simulate first, then test with real users when possible. Small changes — adding an icon beside a colored dot, bumping lightness on one series — often fix issues this tool surfaces in seconds.