Color Contrast Checker

Check WCAG 2.1 color contrast ratios for text and UI components. Instantly verify AA and AAA accessibility compliance for any color combination.

Supports HEX, RGB, HSL, and CSS named colors. Shows pass/fail for normal text, large text, and UI components.

Foreground Color (Text)

Background Color

Sample Text Preview

Early Access — Limited Beta

Editing is a pain in the ass, right?

That's why we're building Cubix. No more editing hell.

AI Video Editor

Drop your footage, tell it what you want. Cubix cuts, captions, color grades, and exports — fully on its own. No timeline. No manual work. Just results.

Start Editing

Cinematic Screen Recorder

Hit record on Windows. Auto-zoom, cinematic backgrounds, and studio-quality audio kick in automatically — your screen recording looks edited before you've touched a thing.

Download Free

No credit card required5 min setupFree to start

♿

WCAG 2.1 Compliant

Checks all five WCAG 2.1 criteria: AA normal, AA large, AA UI, AAA normal, and AAA large text.

🎨

Any Color Format

Accepts HEX (#000), RGB (rgb(0,0,0)), HSL, and 140+ CSS named colors like “navy” or “crimson”.

⚡

Instant Results

Get contrast ratio, WCAG level, and full pass/fail breakdown in seconds. Download a detailed report.

Frequently Asked Questions

What contrast ratio passes WCAG AA?

For normal-sized body text, WCAG 2.1 AA requires at least 4.5:1 contrast against the background. Large text (18pt+ regular or 14pt+ bold) needs 3:1. Graphical UI components and borders often need 3:1 for non-text contrast.

What is WCAG color contrast?

WCAG (Web Content Accessibility Guidelines) specifies minimum contrast ratios so users with low vision can read text. AA requires 4.5:1 for normal text and 3:1 for large text or UI components. AAA requires 7:1 for normal text.

What is a good contrast ratio?

A ratio of 4.5:1 or higher passes WCAG AA for regular text. For large text (18pt+ or 14pt bold), 3:1 is sufficient. A ratio of 7:1 or higher achieves AAA — the highest level.