Color Contrast Checker

Verify that your color combinations meet the Web Content Accessibility Guidelines (WCAG). Ensure your interfaces are readable and inclusive for everyone.

Contrast Ratio
21:1
AAA (Excellent)

Accessibility Preview

Designing for Accessibility

This preview helps you visualize how users will experience this color combination in production environments.

Primary CTA
Ghost Action

WCAG 2.1 Standard: For standard text, a contrast ratio of at least 4.5:1 is required (AA). For large text (18pt or 14pt bold) and graphical elements, 3:1 is sufficient. AAA rating requires 7:1 for normal text.

The Color Contrast Checker helps you test color combinations for accessibility compliance. It calculates contrast ratios using the official WCAG 2.1 algorithm and shows whether your text and background colors pass AA or AAA standards.

This tool works entirely in your browser, so you can experiment freely with colors and instantly verify readability and compliance.