Color Contrast Checker — WCAG Accessibility Tool

WCAG accessibility compliance checker. Check if your color combinations meet accessibility standards.

Colors

Foreground

Background

Presets:

—

Contrast Ratio

Normal Text
≥4.5:1

✗ Fail

Large Text
≥3:1

✗ Fail

AAA

Normal Text
≥7:1

✗ Fail

AAA

Large Text
≥4.5:1

✗ Fail

Live Preview

Heading text — how does this look?

Large body text (18pt / 14pt bold)

Regular body text. This is a paragraph of text at 16px. Readable content should have sufficient contrast to be legible for users with low vision or in challenging lighting conditions.

Small text (12px). Fine print, captions, and labels often use smaller sizes — these need the highest contrast to remain readable for all users.

Large text = 18pt (24px) or 14pt bold (18.67px) and above. Normal text = below 18pt regular / 14pt bold.

WCAG AA (minimum)

Requires 4.5:1 for normal text and 3:1 for large text (18pt+ or 14pt+ bold). This is the legal minimum in many jurisdictions.

WCAG AAA (enhanced)

Requires 7:1 for normal text and 4.5:1 for large text. Recommended for body text, especially for users with low vision.

What is relative luminance?

A measure of perceived brightness (0 = black, 1 = white). The WCAG formula linearizes RGB values and weights them by human eye sensitivity to R, G, and B light.

Privacy

All calculations happen in your browser. No colors are sent to any server. No analytics, no tracking, no data collection.