Always ensure sufficient colour contrast from foreground and background elements.

Always ensure sufficient colour contrast from foreground and background elements.

Why this matters...

Appropriate contrast
Without sufficient contrast between foreground and background elements, users may struggle to perceive content. This is particularly important for visually impaired users.
Text contrast
Good contrast is particularly important to ensure legibility. Text transparency, size, font and animations can influence contrast. This impacts text legibility and accessibility for users.
Contrast beyond text
The need for appropriate contrast applies to user interfaces, icons and any other perceivable content.
Design for readability

Colour and contrast are key considerations for all users. Some people may have difficultly seeing content if there is not enough contrast between foreground and background elements. The most important element is the contrast between text and its background.

WebAim GuidanceWebAim Contrast CheckerMicrosoft WordMicrosoft PowerPoint