Color Contrast Checker
Test foreground and background color combinations against WCAG 2.1 accessibility standards. See pass/fail results for AA and AAA at all text sizes.
Live Preview
Large Text Preview (24px Bold)
Normal text preview (16px). The quick brown fox jumps over the lazy dog. This sample shows how your color combination looks at standard body text size.
Small text preview (14px). Check that this is still readable. Good contrast ensures all users can comfortably read your content.
About WCAG Color Contrast
♿ Why Contrast Matters
Sufficient color contrast ensures text is readable for everyone, including people with low vision or color deficiencies. WCAG 2.1 sets the global standard.
📏 AA vs AAA
AA requires 4.5:1 for normal text and 3:1 for large text. AAA is stricter at 7:1 and 4.5:1 respectively. Most organizations aim for AA compliance as a minimum.
📐 Large Text Definition
Large text is at least 18pt (24px) regular weight or 14pt (18.66px) bold. It has lower contrast requirements because larger glyphs are easier to read.
⚡ Instant & Free
No signup, no server calls. Everything runs in your browser. Test as many color combinations as you need.
Need a color picker built into your workflow? ScreenSnap Pro picks colors from anywhere on screen with a single shortcut.
Try ScreenSnap ProFrequently Asked Questions
What is a good color contrast ratio?
WCAG 2.1 requires a minimum contrast ratio of 4.5:1 for normal-sized text (AA level) and 3:1 for large text. For the stricter AAA level, the requirements are 7:1 for normal text and 4.5:1 for large text.
What counts as large text in WCAG?
Large text is defined as 18pt (24px) or larger for regular weight, or 14pt (18.66px) or larger for bold weight. Large text has lower contrast requirements because it is easier to read.
What is the difference between WCAG AA and AAA?
AA is the minimum level recommended for all web content. AAA is the highest (enhanced) level, providing better readability. Most organizations target AA compliance, while AAA is ideal for critical content like government sites.
How is contrast ratio calculated?
Contrast ratio is calculated using the relative luminance of two colors. The formula is (L1 + 0.05) / (L2 + 0.05), where L1 is the lighter color luminance and L2 is the darker. The result ranges from 1:1 (identical) to 21:1 (black on white).