Color Blind Safe Checker

Enter two colors to see how they appear under three types of color blindness, with WCAG contrast ratios for each simulated view.

Original Colors — Contrast

Sample Text
AA — AAA —

Protanopia (red-blind, ~1% of men)

Original
Text
Simulated
Text
Simulated contrast
AA — AAA —
Simulated: fg — / bg —

Deuteranopia (green-blind, ~1–2% of men)

Original
Text
Simulated
Text
Simulated contrast
AA — AAA —
Simulated: fg — / bg —

Tritanopia (blue-blind, rare)

Original
Text
Simulated
Text
Simulated contrast
AA — AAA —
Simulated: fg — / bg —

Summary

Enter two colors to see how they appear under three types of color blindness, with WCAG contrast ratios for each simulated view.

How it works

  1. Enter or pick a foreground color and a background color using the hex inputs or color pickers.
  2. The tool applies three LMS-space color vision deficiency matrices: protanopia, deuteranopia, and tritanopia.
  3. Each simulation produces a transformed foreground and background color that represents what a color-blind user perceives.
  4. The WCAG 2.1 contrast ratio is computed for each simulation pair and compared against AA (4.5:1) and AAA (7:1) thresholds.
  5. Side-by-side swatches and text previews let you visually compare the original and simulated views.
  6. Use the results to identify which color combinations fail under specific vision types and adjust accordingly.

Use cases

Frequently Asked Questions

Related tools

Last updated: 2026-05-29 · Reviewed by Nham Vu