How Contrast Ratio Is Computed

WCAG 2.x defines contrast ratio using relative luminance, which accounts for the nonlinear way human vision perceives brightness. Each sRGB channel is first linearized: c/12.92 when c ≤ 0.03928, otherwise ((c + 0.055)/1.055)^2.4. Luminance L = 0.2126R + 0.7152G + 0.0722B. The ratio is (L_light + 0.05) / (L_dark + 0.05).

WCAG Requirements

AA: 4.5:1 for normal text, 3.0:1 for large text (18pt or 14pt bold). AAA: 7.0:1 for normal text, 4.5:1 for large text. UI components and graphical objects need 3.0:1. This color contrast calculator checks every combination so you can pick the right level for each element.

Practical Guidance

Dark text on light backgrounds is the most reliable pattern. For white backgrounds, text at or darker than #767676 passes AA normal. Avoid pure black-on-white extremes in large areas — they cause afterimages — and never rely on color alone to convey meaning; combine contrast compliance with labels, icons, and patterns.