Skip to content

WCAG Color Contrast Checker

Not sure whether your color choices are accessible? A11yInspect lets you scan, validate, and test color contrast against WCAG and other global accessibility standards in just few clicks.

Download and install for Chrome
Download and install for Edge
Download and install for Firefox

No Login, No Credit Card required.

Meet Color Contrast Conformance

One Tool to Test Color Contrast Across WCAG 2.2, 2.1 & 2.0, Section 508, EN 301 549, GIGW 3.0, and IS 17802.

Real time monitoring. Automatically scan foreground and background colors, contrast ratios and instantly see what passes or fails for standard text, large text & non text elements.

First, select “Color” as the element type and choose the required accessibility guideline. Click “Test Page” to scan the webpage for color contrast issues. The tool automatically checks the colors and displays the results under “Fail” and “Validate.”

Validate foreground and background colors using the built-in color picker or manually enter color codes in HEX, HEXa, RGB, or RGBa formats for accurate testing.

First, select a foreground (FG) color using the color picker or enter its color code. Next, select a background (BG) color. The tool displays the selected color combination, calculates the contrast ratio, and shows whether it passes or fails WCAG AA and AAA requirements.

It displays every background colors, text colors, font sizes and font families used across your entire webpage.

First, open the CSS Overview section. The tool scans the webpage and displays the foreground and background colors found on the page. It also shows the associated font sizes and font families, helping users review the colors and text styles being used.

Get accurate color combinations that should be avoided on a webpage to meet WCAG contrast requirements.

First, the tool scans the webpage for color combinations. It identifies combinations that fail WCAG requirements and displays the foreground color, background color, contrast ratio, and WCAG pass or fail status for each combination.

Automated color contrast checker

BarrierBreak - a Representative Vendor on the 2025 Gartner® Market Guide for Digital Accessibility

WCAG Text and Background Contrast Requirements

1 Month Free with a yearly subscription!

Monthly Yearly
Element Minimum Contrast Ratio Requirement
Standard Text 4.5:1 Text smaller than 18 pt or 14 pt bold must have a contrast ratio of at least 4.5:1.
Large Text 3:1 Text that is 18 pt or larger or 14 pt bold, must have a contrast ratio of at least 3:1.
Non-text Elements 3:1 Icons, buttons, graphics and other UI elements must have a contrast ratio of at least 3:1 against the background.

Bring accessibility into every design decision

Try the Pro Plan, with a 30-day free trial*. No Credit Card Required.
* If you do not subscribe to A11yInspect Pro, you will be downgraded to A11yInspect Free after the trial ends.

Frequently Asked Questions

  • WCAG requires a minimum contrast ratio of 4.5:1 for standard text and 3:1 for large text & non-text UI elements to ensure readability.

Back To Top