Link contrast is not at least 3:1 with surrounding text

Link to Link contrast is not at least 3:1 with surrounding text copied to clipboard

link-insufficient-contrast

Rule

Color alone MUST NOT be used to distinguish links from surrounding text unless the contrast between the link and the surrounding text is at least 3:1.

Background

When link text is visually differentiated from surrounding body text only by color, people who are color blind or with low vision may miss links. Link text must be differentiated from surrounding text either by: 1) an underline (or other visual differentiation) in the default state, or 2) a contrast ratio of at least 3.0 to 1 between link text and surrounding text. When link text is adequately distinguished from surrounding text, people who have visual disabilities will be less likely to miss links.

How to Fix

Fix this issue by using ONE of the following techniques:

  1. Leave the link text and body text contrast as-is, but add an additional indicator (e.g. underline, outline, etc.) to the link text when it is in its default state.
  2. Increase the contrast between the link text and the body text so that the ratio is at least 3.0 to 1.