No Login Data Private Local Save

APCA Contrast Checker - Online New Accessible Perceptual Contrast

7
0
0
0
Foreground (Text Color)
RGB: 51, 51, 51
Background Color
RGB: 255, 255, 255
Text Settings
10px 72px
86 Lc
Excellent Passes for all text

Threshold: Lc 75 for body text | Lc 60 for large text

45 60 75 90
0 106
Live Text Preview
The quick brown fox jumps over the lazy dog.
Accessibility is about creating inclusive experiences for all.
16px · Normal · Body Text #333333 on #FFFFFF
WCAG 2.x Contrast Ratio
7.83:1 AAA Pass
WCAG 2.x uses a different algorithm APCA provides perceptually accurate results
Preset Color Pairs — See APCA vs WCAG 2.x Differences
on Body text
on Max contrast
on ⚡ APCA advantage
on Dark bg
on Low contrast
on Subtle
Frequently Asked Questions
What is APCA (Accessible Perceptual Contrast Algorithm)?
APCA (Accessible Perceptual Contrast Algorithm) is the next-generation contrast assessment method developed for WCAG 3.0. Unlike the traditional WCAG 2.x contrast ratio (based on luminance ratio math), APCA is grounded in human visual perception research. It accounts for how our eyes actually perceive contrast differences, including factors like text size, font weight, and whether text is light-on-dark or dark-on-light. APCA produces an Lc value from 0 to 106 rather than a ratio like 4.5:1, offering more nuanced and accurate accessibility guidance.
How is APCA different from WCAG 2.x contrast ratio?
WCAG 2.x uses a simple mathematical ratio comparing the relative luminance of two colors. This method treats all colors symmetrically and doesn't consider text size or weight in the core calculation. APCA addresses several WCAG 2.x shortcomings: (1) It correctly evaluates dark-background/light-text scenarios differently from light-background/dark-text; (2) It accurately handles saturated colors (e.g., orange or blue) that WCAG 2.x often misjudges; (3) It incorporates text size and weight into the contrast assessment model; (4) It provides a perceptually uniform scale (0-106 Lc) rather than a ratio that can be misleading.
What Lc value do I need for accessible text?
According to APCA guidelines:
• Lc 90+ — Excellent. Suitable for all text types including small body copy.
• Lc 75–89 — Good. Recommended minimum for body text (text under 24px normal weight, or under ~19px bold).
• Lc 60–74 — Minimum for large text only (24px+ normal weight or 19px+ bold). Not sufficient for body text.
• Lc 45–59 — Marginal. Suitable only for decorative or incidental text that isn't essential for reading.
• Lc below 45 — Insufficient. Should not be used for any meaningful content.
Why does APCA treat light-on-dark differently from dark-on-light?
Human vision is not symmetrical. White text on a black background (light-on-dark) is perceived differently than black text on a white background (dark-on-light), even when the physical luminance difference is identical. Light text on dark backgrounds tends to appear to "bloom" or spread slightly (halation), reducing perceived contrast. APCA accounts for this biological reality by using different calculation curves for each scenario, producing more accurate contrast assessments that match what users actually experience.
Is APCA officially part of WCAG standards?
APCA is the proposed contrast method for WCAG 3.0, which is currently under development by the W3C Accessibility Guidelines Working Group. While WCAG 3.0 has not yet been finalized as a formal recommendation, APCA is already being adopted by forward-thinking designers and developers who want to ensure their products meet the highest perceptual accessibility standards. Many design tools and accessibility checkers now include APCA alongside traditional WCAG 2.x metrics.
Can I use APCA together with WCAG 2.x contrast requirements?
Yes, absolutely. WCAG 2.x remains the current legal and regulatory standard in many jurisdictions. We recommend checking both metrics during your design process. APCA provides more perceptually accurate guidance, while WCAG 2.x contrast ratios ensure compliance with existing regulations. This dual-check approach future-proofs your accessibility efforts and catches edge cases where WCAG 2.x may produce misleading results (such as with saturated oranges, blues, or dark-mode designs).
How are font size and weight used in APCA assessment?
APCA recognizes that larger and bolder text is inherently easier to read at lower contrast levels. The algorithm defines "large text" as 24px or larger at normal weight (400), or approximately 19px (18.66px) or larger at bold weight (700+). Large text has a lower minimum contrast threshold of Lc 60, while body text requires Lc 75. This reflects real-world readability — headlines can be legible at lower contrast than small body copy.
Why does my orange button with white text fail APCA but pass WCAG 2.x?
This is one of the most well-known examples where APCA improves upon WCAG 2.x. Saturated orange (#FF8C00) with white text produces a WCAG 2.x contrast ratio of approximately 3.4:1 — which passes AA for large text. However, due to the way human vision processes saturated orange hues, the perceived contrast is much lower. APCA correctly rates this combination around Lc 45–55 (insufficient for meaningful text). This demonstrates APCA's perceptual accuracy advantage over the purely mathematical WCAG 2.x approach.
Copied to clipboard!