Supashot
Back to all tools

Free WCAG Color Contrast Checker

Verify text-to-background contrast ratios against WCAG standards. No registration, runs 100% locally in your browser.

Normal Text Sample

Designing visually accessible color combinations ensures readability for all users.

Large Text Heading

Contrast Ratio1 : 1
WCAG 2.1 AA (Minimum Standards)
Normal TextRequires 4.5:1 ratio
Fail
Large Text / UI ComponentsRequires 3.0:1 ratio
Fail
WCAG 2.1 AAA (Enhanced Standards)
Normal TextRequires 7.0:1 ratio
Fail
Large TextRequires 4.5:1 ratio
Fail
Power Up Your Workflow

Take screenshots and annotate directly in your browser

Why use manual online uploaders? With the free Supashot Chrome Extension, capture any visible page, selected region, crop, highlight, blur, and copy instantly without leaving your tab.

How WCAG Color Contrast Checker Works

1

Enter your text color and background color using HEX or RGB values.

2

The tool instantly calculates the contrast ratio using the WCAG luminance formula.

3

Review the pass/fail score for normal text, large text, and UI components.

Frequently Asked Questions

WCAG 2.1 AA requires a minimum ratio of 4.5:1 for normal text and 3:1 for large text. WCAG AAA requires 7:1 for normal text and 4.5:1 for large text.

Luminance is calculated using the standard formula: L = 0.2126 * R + 0.7152 * G + 0.0722 * B, where R, G, and B are linearized color values.

Large text is defined as text that is 18pt (typically 24px) or larger, or 14pt (typically 18.66px) and bold.

Yes, we calculate the absolute solid colors. For transparent color channels, we assume overlaying on top of a default dark or light backing.