Home
Tools
Design
Color Contrast Checker

Color Contrast Checker

Popular

Check WCAG contrast ratio between foreground and background colors instantly.

About this tool

Paste any two colors and instantly get WCAG 2.1 contrast ratio. Shows AA and AAA pass/fail for normal text, large text, and UI components. Essential for accessible design.

color contrast checkerwcag contrast ratioaccessibility color checkercontrast ratio tool

Loading…

TABNIO

Free browser utility tools — JSON formatter, password generator, word counter, and 40+ more tools. No signup required.

Quick Links

All Tools
Developer
Security
Writing

Color Contrast Checker

Popular

Check WCAG contrast ratio between foreground and background colors instantly.

Foreground (Text)

Background

Large Text (24px) Sample

Normal text. The quick brown fox jumps over the lazy dog.

Small text (14px). Lorem ipsum dolor sit amet consectetur.

Contrast Ratio

13.44:1

AA NormalPASS
Body text < 18pt or < 14pt bold
Requires 4.5:1 minimum
AA LargePASS
Large text ≥ 18pt or ≥ 14pt bold
Requires 3:1 minimum
AAA NormalPASS
Body text < 18pt or < 14pt bold
Requires 7:1 minimum
AAA LargePASS
Large text ≥ 18pt or ≥ 14pt bold
Requires 4.5:1 minimum