Contrast Checker

Check the contrast ratio between text and background colors to ensure accessibility compliance.

Color Inputs

Choose your foreground and background colors

Live Preview

See how your colors look together

Large Text Sample

This is a sample of normal text to help you visualize how your color combination will look in practice. The contrast ratio affects readability and accessibility.

Small text sample for detailed content.

Contrast Ratio

WCAG accessibility compliance results

WCAG Guidelines

Web Content Accessibility Guidelines

AAA Level

Enhanced accessibility: 7:1 contrast ratio for normal text, 4.5:1 for large text.

AA Level

Standard accessibility: 4.5:1 contrast ratio for normal text, 3:1 for large text.

AA Large Text

Only large text meets standards: 3:1 contrast ratio for large text only.

Fail

Does not meet accessibility standards. Consider adjusting colors.