Karachi, Pakistan Mon–Sat: 10AM–7PM PKT
Home Services
Design & Development
UI/UX Design Web Development WordPress Development Responsive Web Design Corporate Website Landing Pages / Microsites E-Commerce Solutions Mobile App Development
Marketing & Growth
SEO Services Content Marketing Social Media Marketing PPC / Google Ads Branding & Creative Speed & Performance
Hosting & Support
Web Hosting Maintenance & Support
Portfolio
Website Design Logo & Graphics
Clients About Blog Free Tools Get a Quote
Free Design Tool

Free Color Contrast Checker

Make sure your text is easy to read for everyone. Check any colour pair against the WCAG accessibility standards in real time.

–
Contrast ratio (ranges from 1:1 to 21:1)
Live preview

Free, no sign-up. Runs in your browser, so nothing you enter or upload is sent to our server.

How to Use the Color Contrast Checker

  1. Enter or pick a text colour and a background colour.
  2. Read the contrast ratio and the pass or fail result for normal and large text.
  3. Look at the live preview to judge readability yourself.
  4. If a check fails, use the suggested darker or lighter colour that passes.

Why It Matters

Light grey text on a white background may look elegant, but many people cannot read it comfortably, especially on a phone outdoors. Low contrast is the most common accessibility problem on websites, and Google's Lighthouse audit flags it.

The WCAG standard asks for a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text (about 24 px, or 19 px bold) to reach level AA. Level AAA asks for 7:1 and 4.5:1. This checker calculates the ratio exactly as WCAG 2 defines it and suggests the nearest colour that passes.

Color Contrast Checker: Questions

What contrast ratio do I need?
For WCAG AA: 4.5:1 for normal text and 3:1 for large text and icons. For AAA: 7:1 and 4.5:1.
What counts as large text?
Text at least 24 px (18 pt) regular, or about 19 px (14 pt) bold.
Does contrast affect SEO?
Not directly, but it affects how easily people read your page, and it is part of the accessibility score in Google Lighthouse and PageSpeed Insights.
Does the brand red #E31E24 pass on white?
Yes, for most uses: it has a ratio of about 4.7:1 on white, which passes AA for normal and large text. Try it in the checker.

More Free Website Tools

See all free tools

Want a Fast Website
Built for You?

Tell us about your business and we will reply within 24 hours with honest advice and a fixed quote.