How it Works

Please select a foreground color and a background color. You can enter hex color codes or use the color selector tool. The “WCAG Compliance Information” chart will tell you if the selected colors pass conformance.

Select Colors

Contrast Ratio

WCAG Compliance Results

Small Text Pass Pass
Large Text Pass Pass
UI Components Pass-

This contrast checker attempts to calculate contrast ratios as accurately as possible. There may be situations where a color combination meets the calculated ratio; but the element being checked still fails overall. This may be due to other visually related factors (ex. hover/focus states and effects, etc).

Required Contrast Ratios for WCAG Conformance

Level AA – Text
4.5:1 for regular text and 3:1 for large text (18 pt or 14 pt + bold).
WCAG Success Criterion 1.4.3

Level AA – Non-Text
3:1 for UI components & graphics.
WCAG Success Criterion 1.4.11

Level AAA – Text
7:1 for regular text and 4.5:1 for large text (18 pt or 14 pt + bold).
WCAG Success Criterion 1.4.6

More Resources and Tools

Explore accessibility resources and tools to check accessibility compliance and remediate it.

Website Accessibility Checker

Scan websites to discover accessibility issues.

Visit Website Accessibility Checker

Accessibility Statement Generator

Show the world that you’re dedicated to making your website accessible.

Visit Accessibility Statement Generator

All in One Accessibility Knowledge Base

Ask our experts any accessibility question and browse through answered topics.

Visit All in One Accessibility Knowledge Base