Link Contrast Fixtures (Intentional Errors)
This page includes intentional failures where links differ from surrounding text only by color. Some pairs are below 3:1 contrast to help validate your detector. This build also includes explicit 1:1 same-color cases.
A0. FAIL — Same color (1:1) as surrounding text
Surrounding copy uses #4A5568. The link below is the exact same colorand provides no additional visual cue:indistinguishable link.
Surrounding text adds emphasis, but the link is still only differentiated by color and shares the same color:same-color link.
Same color for normal/visited/hover states (neutralized above); still fails:persistent same-color link.
All A0 links are 1:1 color-only and should be flagged.
A1. FAIL — Color-only links with contrast < 3:1
In this paragraph the link is styled purely by color and is too close to the surrounding text. Try thissubtle link.
Another low-contrast color-only link appears herecolor-only link, which should fail the 3:1 threshold.
And one more barely differentbarely different link.
All links above are color-only and should be flagged if contrast < 3:1.
B. PASS — Color-only links with contrast ≥ 3:1
This paragraph contains a color-only link that should pass the 3:1 threshold:passing color-only link.
Against darker surrounding text, the same link color should clearly pass:high-contrast link.
Links here are color-only but should be PASSED by your tool.
B2. Borderline Cases (Near Threshold)
Link slightly below threshold (~2.95:1):almost pass.
Link slightly above threshold (~3.05:1):just passes.
C. Conforming — Links with extra visual cues
Underlined link (conforming): underlined link
Bold link (conforming): bold link
Larger link (conforming): larger link
C2. PASS — Same color as text, but with non-color cues
Same color as surrounding text, but underlined — should pass.
Same color as surrounding text, but bold — should pass.
D. Mixed paragraph with multiple links
Here we mix several links: a failing color-onlysubtle, a passing color-onlyclearly blue, and an underlined link (conforming).
F. Surrounding-text differentiation checks
Surrounding text has italics, but the link adds no non-color cue and is the same color:same-color link.
Surrounding text uses slight opacity; the link is the exact same color (no cues):same-color link.
Non-interactive element that looks like a link (should NOT be flagged as an anchor):text styled like a link.