Color Contrast Checker
Pick a foreground and background, see the contrast ratio with AA / AAA badges, preview multiple text sizes, get suggested colors that pass, and simulate the result across the main types of color blindness.
Contrast ratio
14.0:1
Highest passing level
AAA · Normal text
Lowest failing level
None
Live preview
Type styles rendered with the chosen colors.
Live preview
Type styles rendered with the chosen colors.
Body text small (12px)
Body text default (14px)
Body text large (16px)
Large bold text (18.66px • WCAG large)
Heading (24px)
Display heading (32px bold)
WCAG verdict
Where this pair lands across the WCAG 2.x thresholds.
Contrast ratio
14.0:1
Passes AAA for body text — works for everyone, everywhere.
Fix it
Hand-picked alternatives that hit AA contrast (>= 4.5:1).
You're already passing AA — no fix needed.
Color blindness simulation
Re-render the preview as someone with color vision deficiency would see it.
Re-render the preview as someone with color vision deficiency would see it.
Quick presets