Contrast – Accessibility Guidelines

Contrast (Minimum) #

The visual presentation of text and images of text has a contrast ratio of at least 4.5:1, except for the following:

• Large Text: Large-scale text and images of large-scale text have a contrast ratio of at least 3:1.
• Incidental: Text or images of text that are part of an inactive user interface component, that are pure decoration, that are not visible to anyone, or that are part of a picture that contains significant other visual content, have no contrast requirement.
• Logotypes: Text that is part of a logo or brand name has no minimum contrast requirement.

Content/Design Considerations

• Select colors for text and background that exceed the contrast requirement.
  • Large Text is at least 18 point text or at least 14 point for bold text.
  • If using colors that have a gradient, use the lightest color in the gradient for the contrast ratio test.
  • Note: The default red color in CSS does not provide enough contrast against white if it’s not large text. Use a slightly darker red, like #E60000 for standard font sizes.
• Test color contrast with the WebAIM color contrast checker
• Ensure style guidelines for your organization meet the minimum contrast requirements.