Color Contrast Ratio Checker (WCAG 2.1 AA / AAA Compliance)

A high-contrast pairing that clears every WCAG threshold

Dark navy text (#0F172A) on a white background (#FFFFFF) produces a contrast ratio of 17.85:1 -- comfortably passing all four common WCAG thresholds: AA normal text (4.5:1), AAA normal text (7:1), AA large text (3:1), and AAA large text (4.5:1).

WCAG contrast ratios range from 1:1 (identical colors, no contrast at all) to 21:1 (pure black on pure white, the maximum possible) -- 17.85:1 sits close to that maximum, which is why this pairing clears even the strictest AAA threshold with substantial margin to spare.

Large text gets more lenient thresholds (3:1 for AA, 4.5:1 for AAA) than normal-size text (4.5:1 and 7:1) because larger text is inherently easier to read even at lower contrast -- WCAG's size-based distinction reflects that real readability difference, not an arbitrary discount.

What this contrast ratio calculation is built on

Uses sRGB relative luminance. Large text here means the 3:1 / 4.5:1 thresholds, not a font-size detector. The contrast ratio formula is based on each color's relative luminance in the sRGB color space -- a specific, standardized calculation (not simply comparing lightness values informally) that WCAG defines precisely so contrast checking is consistent and reproducible across different tools and checkers.

This tool checks the numeric threshold only -- it doesn't detect or verify your actual font size, so 'large text' here means you need to separately confirm your real text qualifies as WCAG's definition of large (generally 18pt+, or 14pt+ bold) before relying on the more lenient large-text thresholds.

Contrast ratio is symmetric regardless of which color is foreground and which is background -- checking white text on this same navy background would produce the identical 17.85:1 ratio, since the formula doesn't distinguish which of the two colors sits 'on top.'

Checking contrast across a full palette

For checking many foreground/background combinations at once rather than one pair at a time, the Batch Color Contrast Checker handles that at scale.

For a broader accessibility score across an entire color palette (not just contrast between two specific colors), the Color Palette Accessibility Score Checker is the related tool.

Frequently Asked Questions (FAQ)