What is the minimum contrast ratio for WCAG AA?

WCAG 2.1 AA requires a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text (18pt or 14pt bold). AAA requires 7:1 and 4.5:1 respectively.

What counts as large text?

Large text is 18pt (approximately 24px) or larger in regular weight, or 14pt (approximately 18.67px) or larger in bold.

Is my data sent to a server?

All contrast calculations run in your browser.

Why does my design tool show a different ratio?

Usually because of rounding. This tool cuts the ratio to two decimals instead of rounding it, so 4.499:1 shows as 4.49 and fails AA, where a tool that rounds shows 4.50. It uses the WCAG 2.1 relative luminance formula with the sRGB 0.04045 threshold, which gives the same result as WCAG's 0.03928 for 8-bit colors.

Contrast checker

Contrast checker is an accessibility tool that measures the contrast ratio between a text color and a background color. It scores the pair against WCAG 2.1 AA and AAA for normal and large text, offers an APCA mode that reports an Lc score, and previews both colors on sample text. The tool runs in your browser.

Foreground (text)

Background

Aa Large text sampleNormal body text sample, the quick brown fox jumps over the lazy dog.

Contrast ratio	21.00 : 1
AA. Normal text (≥4.5:1)	pass
AA. Large text (≥3:1)	pass
AAA. Normal text (≥7:1)	pass
AAA. Large text (≥4.5:1)	pass

MODE

PRESETS

Runs entirely in your browser

Dedicated pages

Direct links for each accessibility standard.

WCAG AA contrast checker

Check if your colour combination meets WCAG 2.1 AA accessibility requirements. Instant pass/fail result with the contrast ratio. Runs in your browser.

WCAG AAA contrast checker

Check if your colour combination meets the enhanced WCAG 2.1 AAA contrast standard. The highest accessibility level for text. Runs in your browser.

Large text contrast checker

Check contrast requirements for large text (18pt or 14pt bold). Lower thresholds apply for large text under WCAG 2.1. Runs in your browser.

APCA contrast checker

Check colour contrast using the APCA (Advanced Perceptual Contrast Algorithm), a proposed contrast model for WCAG 3.0. Runs in your browser.

How to check colour contrast

Enter your foreground (text) colour and background colour as 3 or 6 digit HEX values, or use the colour pickers.
The contrast ratio is calculated instantly against WCAG 2.1 standards.
Check whether your colour combination passes AA or AAA level for normal and large text.
Adjust either colour until the ratio meets your target standard.

Common uses

Verifying that text colours meet WCAG accessibility requirements before publishing a website, use color converter to get the HEX values from RGB or HSL first
Choosing background and foreground colour pairs that are readable for users with low vision, picked from a cohesive color palette
Testing button labels, links, and body text for sufficient contrast ratios, and exploring tints and shades of a brand colour to find an accessible variant

Technical specification

Algorithm or formula: WCAG 2.1 relative-luminance formula. Each sRGB channel is linearised with the sRGB 0.04045 threshold (WCAG 2.1 states 0.03928, which gives the same result for 8-bit colours), then weighted (R 0.2126, G 0.7152, B 0.0722). Contrast ratio = (L1 + 0.05) / (L2 + 0.05).
Browser API or library: Pure JavaScript arithmetic. No external library.
Input limits: 3 or 6 digit HEX (with or without #), or any color the visual picker emits. RGB values and alpha are not accepted (alpha-on-background blending is not modelled).
Output: Numeric contrast ratio plus pass/fail badges for WCAG AA, AAA, normal text, and large text. The ratio is cut to two decimals rather than rounded up, so a pair just under a threshold never shows the threshold value. APCA mode shows the Lc score instead.
Known limitations: WCAG 2.x contrast ratio, plus an APCA-W3 0.0.98G Lc score (APCA is not yet an official standard). APCA mode gives general Lc guidance, not APCA's font size and weight tables. Does not blend semi-transparent foregrounds against the background.

Frequently asked questions

What is the minimum contrast ratio for WCAG AA?: WCAG 2.1 AA requires a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text (18pt or 14pt bold). AAA requires 7:1 and 4.5:1 respectively.
What counts as large text?: Large text is 18pt (approximately 24px) or larger in regular weight, or 14pt (approximately 18.67px) or larger in bold.
Is my data sent to a server?: All contrast calculations run in your browser.
Why does my design tool show a different ratio?: Usually because of rounding. This tool cuts the ratio to two decimals instead of rounding it, so 4.499:1 shows as 4.49 and fails AA, where a tool that rounds shows 4.50. It uses the WCAG 2.1 relative luminance formula with the sRGB 0.04045 threshold, which gives the same result as WCAG's 0.03928 for 8-bit colors.

Related tools

Background reading: Complete guide to color tools
Step by step: Build a color system for a design project

Reviewed and tested September 30, 2026.