Contrast Checker (WCAG)
Contrast Checker calculates the luminance contrast ratio between any two colors and tests against WCAG 2.2 requirements: Level AA requires 4.5:1 for normal text and 3:1 for large text (18px+ or 14px+ bold); Level AAA requires 7:1. Enter hex codes or use the color pickers, and the ratio and pass/fail badges update in real time. Essential for accessible web design. Runs in your browser.
Related: ColorPaletteMarkdown Preview
Your files and inputs stay in your browser — nothing is uploaded or stored.
Preview
Large text — 24px bold
Large text — 18.66px regular
Normal body text at 16px. The quick brown fox jumps over the lazy dog. WCAG AA requires 4.5:1 contrast for text under 18pt (or under 14pt bold).
Small text 14px — same paragraph at a smaller size.
Contrast ratio
7.07:1
AA — Normal text
Min 4.5:1
AA — Large text
Min 3:1
AA — UI components
Min 3:1
AAA — Normal text
Min 7:1
AAA — Large text
Min 4.5:1