Accessible link colors
Check link, text and background colors
Check inline links in their actual paragraph. Measure both text colors against the background, then see how an underline changes the need to distinguish the link from surrounding text.
This tool assumes normal-size text and opaque sRGB colors. A permanent underline is the clearest starting point. Keyboard focus, visited states, and meaningful link text still need review.
Try the paragraph
Three relationships to inspect
The selected numeric and underline checks pass. This is a focused color check, not a complete accessibility audit.
Link on background
5.169:1
Pass · target 4.5:1
WCAG 2.2 AA, normal text
Body text on background
17.740:1
Pass · target 4.5:1
WCAG 2.2 AA, normal text
Link against body text
3.432:1
3:1 not needed: persistent underline
G183: lightness distinction when no persistent cue is present
Decisions use the unrounded value. A 3:1 difference from body text is a sufficient technique for color-based link distinction; it does not replace 4.5:1 text-to-background contrast. Review non-color cues and every interaction state in your own interface.
Save the tested roles, original and adjusted colors, raw pass/fail results, calculation versions and a link that restores these inputs.
Four examples to try
Underline a subtle link
Both text colors are readable on white. The permanent underline identifies the link even though the two text colors are close.
#374151 / #111827 / #FFFFFF
Blue links on white
Check the link against both black body text and white. This is the combination described in W3C G183; add clear hover and keyboard-focus cues.
#3366CC / #000000 / #FFFFFF
Turquoise needs a text fix
An underline identifies this link but does not fix its low text contrast against white. Try a darker link and recheck.
#40E0D0 / #111827 / #FFFFFF
Links in dark mode
Both text colors can be readable on a dark surface without being sufficiently different from each other. Keep the underline.
#93C5FD / #F9FAFB / #111827
Sources and limits
These checks cover ordinary inline text on a solid background. Font size, actual compositing, focus visibility, visited links, color vision, and the rest of the page need separate consideration. Even when numeric checks pass, an underline makes links easier to recognize.