Home  ›  Color Tools  ›  Color Blindness Simulator

Color Blindness Simulator

Preview how your colors or designs look to people with different types of color vision deficiency u2014 including deuteranopia, protanopia, and tritanopia u2014 directly in your browser.

✓ Free✓ No signup✓ Privacy first✓ Runs in your browser

How it works

Simulate color vision deficiency in three steps

Enter a color or upload an image

Input a HEX or RGB color value for quick single-color testing, or upload a screenshot or design file to simulate how an entire composition looks under different color vision conditions.

Select a color vision type

Choose from the available simulation modes: deuteranopia (red-green), protanopia (red-green), tritanopia (blue-yellow), achromatopsia (monochromatic), or normal vision for baseline comparison.

Compare the results

The tool renders side-by-side previews of the original and simulated views so you can immediately identify which colors become indistinguishable and make targeted adjustments to your design.

FAQ

Common questions about color blindness simulation

What are the most common types of color blindness?
Color vision deficiency affects approximately 8% of males and 0.5% of females of northern European ancestry. The most prevalent forms are deuteranopia and deuteranomaly (reduced or absent sensitivity to green wavelengths) and protanopia and protanomaly (reduced or absent sensitivity to red wavelengths). These two categories are collectively known as red-green color blindness. Tritanopia (reduced blue sensitivity) is considerably rarer. Achromatopsia u2014 complete absence of color perception u2014 is the rarest form and affects a very small proportion of the population.


Why should designers test their work for color blindness?
Approximately 1 in 12 men has some form of color vision deficiency. Interfaces that rely on color alone to convey information u2014 such as red/green status indicators, charts using similar hues for different data series, or links that differ from body text only in color u2014 can be entirely inaccessible to a meaningful portion of users. WCAG Success Criterion 1.4.1 explicitly requires that color is not the only visual means of conveying information, distinguishing UI components, or indicating an action. Testing during design prevents costly remediation after development.


How accurate is the simulation?
The simulations use mathematical colour transform models u2014 primarily the Machado, Oliveira, and Fernandes (2009) algorithm u2014 which approximate the perceptual experience of each deficiency type by transforming colour values through a calibrated matrix. These are the most widely validated computational simulations available and are reasonably accurate for design testing purposes. However, colour vision deficiency exists on a spectrum, and individual experience varies considerably. The simulation models the more extreme dichromatic cases and may not perfectly represent everyone with a milder anomalous trichromacy.


What design changes most help people with color vision deficiency?
Several practical design choices improve usability across color vision types: use both color and shape or pattern to distinguish data series in charts; ensure sufficient luminance contrast between elements rather than relying on hue contrast alone; add text labels or icons to status indicators instead of relying solely on red/green colour coding; and prefer colour palettes that remain distinguishable under the most common deficiency types u2014 blue/orange combinations remain distinguishable for most forms of colour blindness, while red/green combinations are the most commonly problematic pairing.

Keep going

Related tools

Color Contrast Checker

Verify WCAG contrast compliance for your adjusted color pairs after testing.

Open tool

Color Palette Generator

Generate palettes and preview them for color vision accessibility.

Open tool

Color Picker

Select accessible color alternatives when replacing inaccessible pairs.

Open tool

Image Color Extractor

Extract dominant colors from existing designs before testing their accessibility.

Open tool

About the Color Blindness Simulator

The Color Blindness Simulator allows designers and developers to preview how colors and images appear to people with different types of color vision deficiency. It is used as part of accessibility testing workflows to identify design decisions that create barriers for a statistically significant portion of users. Testing for colour blindness accessibility is recommended by WCAG, referenced in major accessibility standards, and increasingly expected as part of professional design-for-inclusion practice.

Benefits

• 
  Simulates deuteranopia, protanopia, tritanopia, and achromatopsia in one tool
• 
  Side-by-side comparison makes problematic color pairs immediately visible
• 
  Accepts both individual color values and uploaded design screenshots for testing
• 
  Runs entirely client-side u2014 no image data is transmitted to any server

Privacy

Any images or color values processed by this tool remain entirely within your browser; no data is uploaded to or stored on any server.