WebAIM Link Contrast Checker

For better usability and accessibility, links should be underlined by default. Otherwise, according to Web Content Accessibility Guidelines (WCAG) link text must have at least a 3:1 contrast ratio with the surrounding body text, and must present a non-color indicator (typically underline) on mouse hover and keyboard focus. In addition to this, both links and body text must have at least a 4.5:1 contrast ratio with the background.

This service provided by WebAIM (the same company behind the Web Accessibility Evaluation Tool (WAVE)) allows you to quickly check the contrast ratio allows you to quickly check the contrast ratio between links, text and background colors. You can enter colors as RGB values, hexadecimal codes, or leveraging the provided color pickers. Feedback will be provided for all three required contrast calculations.

If you need to calculate color contrast ratio for large text or to check your color choices against the WCAG AAA conformance level requirements, you can use the generic contrast checker also offered by WebAIM.

The service can also be queried via an API endpoint returning all data in JSON format.

• View WebAIM Link Contrast Checker

Filed under:

• Color Contrast
• Design
• Web Accessibility Resources
• Web Services