ToolPremier Logo
ToolPremier

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 — including deuteranopia, protanopia, and tritanopia — directly in your browser.
✓ Free✓ No signup✓ Privacy first✓ Runs in your browser
Color Blindness Simulator – ToolPremier

Select or drop an image

PNG, JPG, or WebP up to 10MB

Choose Image

Color Blindness Simulator · Protanopia, Deuteranopia, Tritanopia, Achromatopsia · local rendering

How it works

Simulate vision in three steps

1. 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.

2. 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.

3. 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

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 — complete absence of color perception — is the rarest form and affects a very small proportion of the population.
Approximately 1 in 12 men has some form of color vision deficiency. Interfaces that rely on color alone to convey information — such as red/green status indicators, charts using similar hues for different data series, or links that differ from body text only in color — 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.
The simulations use mathematical colour transform models — primarily the Machado, Oliveira, and Fernandes (2009) algorithm — 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.
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 — 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 — 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.