Skip to main content

Color Contrast CheckerDeveloper

Check if your foreground and background colors meet WCAG accessibility standards.
Presets:

Preview

The quick brown fox jumps over the lazy dog.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Contrast ratio

5.17:1

Meets WCAG AA

Normal Text (AA)

Pass

Requires 4.5:1

Large Text (AA)

Pass

Requires 3.0:1

WCAG AAA

Fail

Requires 7.0:1

WCAG AA Compliant (Standard)

Good

Meets standard accessibility requirements for all regular text and passes AAA for large text.

WCAG 2.1 Compliance Breakdown

Normal Body Text

< 18pt regular or < 14pt bold

Level AA (4.5:1)Pass
Level AAA (7.0:1)Fail

Large Text & Headings

≥ 18pt regular or ≥ 14pt bold

Level AA (3.0:1)Pass
Level AAA (4.5:1)Pass

UI Components & Icons

Borders, focus rings, icons, buttons

Level AA (3.0:1)Pass

Capabilities & How-To Guide

Instructions, supported options, and client-side privacy guarantee.

Web Accessibility ensures that digital content is usable by everyone, including people with visual impairments. Our tool helps you verify that your text is readable against its background.

WCAG 2.1 Guidelines:

  • AA Standard: Minimum contrast ratio of 4.5:1 for normal text and 3:1 for large text.
  • AAA Standard: Enhanced contrast ratio of 7:1 for normal text and 4.5:1 for large text.
Need an extra feature or found an edge case?Send Feedback