Skip to main content
Toolbox
Design & Media

WCAG & APCA Color Contrast Checker

Check color contrast ratios against WCAG 2.1 AA and AAA criteria, evaluate APCA lightness scores, and simulate color vision deficiencies in real-time.

Quick Answer & Summary

The WCAG & APCA Color Contrast Checker is a fast, accurate Design & Media utility designed to check color contrast ratios against wcag 2.1 aa and aaa criteria, evaluate apca lightness scores, and simulate color vision deficiencies in real-time. entirely in your browser with zero server data storage.

WCAG 2.1 Contrast Ratio
13.58:1
AAA Compliant (Enhanced)
APCA Lightness Contrast
Lc 82
Preferred for Body Text & Subtitles (Lc 75+)
Quick Presets
Normal Text
WCAG AA (≥4.5)
Normal Text
WCAG AAA (≥7.0)
Large Text
WCAG AA (≥3.0)
Large Text
WCAG AAA (≥4.5)
UI Components
Non-text (≥3.0)
Live Render Preview & Vision Simulation

The Quick Brown Fox Jumps Over The Lazy Dog

This preview simulates how regular body text and headings appear under the selected vision condition. High contrast ensures readability across various ambient lighting environments and screens.

Foreground: #2c221a · Background: #f5efe4

Share This Tool

Help your team and fellow developers save time with free, private client-side utilities.

TB
Toolbox Editorial TeamVerified Authors

Systems & Security Engineers • Applied Cryptography & High-Performance Web Tools

Updated:
100% In-BrowserZero server storage
Standards AuditedRFC & ISO compliant
Peer ReviewedEditorial Policy
Documentation & Guide

How to Use WCAG & APCA Color Contrast Checker

1

Pick or enter foreground & background colors

Use the color pickers or enter hex values for your text and background surfaces.

2

Check WCAG AA & AAA ratings

View pass/fail status for regular text (≥4.5:1), large text (≥3.0:1), and UI graphical components.

3

Simulate color vision conditions

Select Protanopia, Deuteranopia, Tritanopia, or Achromatopsia to verify accessibility for all users.

Pro Tips
Aim for at least 4.5:1 for normal body text and 3:1 for large headings (18pt+ or 14pt bold).

Frequently Asked Questions (PAA)

Related Tools & Converters

Authoritative Standards & Citations

Calculations and algorithms on this page are implemented and verified in strict accordance with the following official technical specifications: