Color Contrast Checker

Calculate contrast ratio between foreground and background colors and check WCAG compliance.

Sample text Aa 123
Contrast Ratio
WCAG AA (Normal text 4.5:1)
WCAG AA (Large text 3:1)
WCAG AAA (Normal text 7:1)

Usage

Select foreground and background colors. Contrast ratio and WCAG 2.1 AA/AAA compliance (normal/large text) are shown.

When to use

Accessibility compliance, UI color selection, text readability, WCAG verification.

Examples

White on black = 21:1, #666 on #fff = 5.74:1.

Related tools