Designer

COLOR CONTRAST CHECKER

Calculate color contrast ratios for WCAG 2.1 AA and AAA accessibility compliance.

Sample Text Heading

Check contrast ratios to meet WCAG AA and AAA accessibility standards.

Contrast Ratio
5.35 : 1
WCAG AA Normal
PASS
WCAG AA Large
PASS
WCAG AAA Normal
FAIL

Color Selection

HOW TO USE COLOR CONTRAST

01

Step 1

Pick foreground text color and background container color.

02

Step 2

Calculate contrast ratio (e.g. 4.5:1 for WCAG AA).

03

Step 3

Inspect pass/fail results for normal text, large text, and AAA compliance.

FREQUENTLY ASKED QUESTIONS

What is the minimum WCAG AA contrast ratio?

WCAG 2.1 AA requires a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text (18pt+ or 14pt+ bold).

RELATED TOOLS

Explore All

Color Picker

Visual color picker.

Color Blindness Simulator

Simulate color vision deficiencies.