Process up to 200 images per job — pick your settings once, run them all.
Paste a foreground and background colour (or pick from a screenshot); get the contrast ratio and which WCAG levels it passes. WCAG 2.1 AA is the legal accessibility baseline in most jurisdictions; AAA is the higher standard recommended for critical content.
The thresholds
- WCAG AA, normal text: 4.5:1 minimum.
- WCAG AA, large text (18pt+ or 14pt+ bold): 3:1 minimum.
- WCAG AAA, normal text: 7:1 minimum.
- WCAG AAA, large text: 4.5:1 minimum.
- Non-text UI components (buttons, form borders): 3:1 minimum (WCAG 2.1+).
Why contrast matters
Low-contrast text is unreadable for users with low vision (about 4% of the population), users in bright sunlight, users on cheap monitors, and aging eyes (everyone, eventually). Many design systems default to grey-on-grey because it looks elegant on a designer's calibrated 5K display — and is unreadable elsewhere.
Failing WCAG AA is also legally actionable in the US (ADA Title III), EU (EAA), and many other jurisdictions. Cheap insurance: run every text/background pair through a checker before shipping.
What we report
- Contrast ratio as a number (e.g. 4.71:1).
- Pass/fail for each WCAG level and text size.
- Suggested fixes: the closest darker foreground or lighter background that would pass.
- Live preview with sample text in the colour pair.
Pair with the colour-blindness simulator
Contrast and colour-blindness are different accessibility axes. Run Color Blindness Simulator on the same UI to verify it works for users with CVD too.
Frequently asked questions
What's a 'large text' definition?
WCAG: 18pt regular or 14pt bold. Roughly 24px regular or 19px bold in CSS.
Does it work on gradients?
Test the worst-case point — typically the lightest part of the gradient against your foreground.
Can I check from a screenshot?
Yes — upload a screenshot and click foreground and background colours.
What's the minimum acceptable ratio?
WCAG AA: 4.5:1 for body text. Anything below is non-compliant.
Does darker always mean better?
Higher contrast is better for readability. But pure black on pure white can be harsh; many systems use #1A1A1A on #FAFAFA for slightly softer contrast that still passes AAA.
What about icon contrast?
WCAG 2.1 added a 3:1 minimum for non-text UI components — buttons, form borders, focus rings.
Can I batch check colour pairs?
Premium: paste a CSV of pairs and get all ratios in one report.
Are uploads private?
Yes — deleted within 24 hours.
About Contrast Checker
Contrast Checker is a free online tool from Wallpapers.com that runs entirely in your browser — no install, no watermark, no email sign-up for the first try.
Check if a foreground / background color pair passes WCAG accessibility.
How to use Contrast Checker
- Drop your image into the upload area (single or batch — toggle Bulk at the top).
- Pick any settings the tool exposes (size, format, quality).
- Click Run. The result downloads automatically — no manual save step.
When to use it
Common use cases include:
prepping images for web upload, e-commerce listings, social media platforms with format constraints, and converting files from one device or app to another.
Free vs Premium
Every visitor gets a free trial run; signed-in free users get a higher daily quota. Subscribe to
Premium
for unlimited runs, bulk processing up to 200 images per job, priority queue, and ad-free browsing.
Related tools
Looking for something slightly different? Try the
EXIF Stripper
,
Strip EXIF Metadata
or
EXIF Viewer
— or browse all
Metadata & Accessibility tools.
