Color Blindness Simulator

About Color Blindness Simulator

Daltonism simulator tools replicate the visual experience of color vision deficiencies so designers and developers can check their work for accessibility. This free browser-based tool simulates several types of color blindness, including red-green and blue-yellow variations, on any color or uploaded image. No signup required. Use it to verify that your color choices remain distinguishable for all users.

Color Blindness Simulator is a free browser-based tool that shows how an uploaded image appears to people with different types of color vision deficiency. Users upload any image and select a color blindness type: deuteranopia (red-green, the most common form), protanopia (red-green, rarer), tritanopia (blue-yellow), or achromatopsia (complete color blindness). The tool applies the corresponding color transformation matrix to the image and displays the simulated result alongside the original. This helps designers verify that their visual designs remain understandable and usable for color-blind users, who make up approximately 8 percent of males and 0.5 percent of females. The tool runs entirely in the browser using HTML canvas with no file sent to a server. No account or installation is required.

Color Blindness Simulator is an important accessibility tool for UI designers, graphic designers, data visualisation creators, and anyone who produces visual content that needs to communicate clearly across all audiences. The most common form, deuteranopia, affects the perception of red and green wavelengths, causing colors that appear distinct to full-color vision to look similar or identical. This directly affects common design patterns such as red error states and green success states, charts that use red and green as series colors, and traffic-light status indicators. By simulating how a design appears with deuteranopia, designers can identify combinations that rely solely on color distinction for meaning and add secondary cues such as icons, patterns, or labels to ensure the information is accessible. Tritanopia, which affects blue-yellow perception, is less common but relevant for designs that use blue and yellow as primary distinguishing colors in data visualisation or UI status systems. Achromatopsia simulation shows the design in complete grayscale, which is the most extreme test of whether the design communicates without color at all. A design that remains understandable in grayscale typically works for all forms of color blindness. The tool is useful at any stage of design: early simulation during palette selection prevents building a design on a color system that fails for color-blind users, while late-stage simulation catches issues before launch. The image is processed entirely in the browser with no server upload.

How to use Color Blindness Simulator

  1. Enter your color using the color picker or HEX input
  2. See how the color appears across 5 types of vision
  3. Copy the simulated HEX value for any vision type

Frequently Asked Questions

What types of color blindness are simulated?
Protanopia (red-blind), Deuteranopia (green-blind), Tritanopia (blue-blind), and Achromatopsia (complete color blindness).
How accurate is the simulation?
The simulation uses the Machado et al. (2009) matrices, a widely cited scientific model for color blindness simulation. Results are approximate.
How can I use this for accessibility?
Check that your UI colors remain distinguishable across all simulated types, and pair it with the Contrast Checker tool for full WCAG compliance.