Use of colour
Approximately 4.5% of the UK population are colour blind or have colour vision deficiencies, and around 2 million people live with some form of sight loss or visual impairment.
Relying solely on colour to convey messages can make content inaccessible to individuals with colour blindness, preventing them from understanding the information. Additionally, this can cause difficulties when content is printed in black and white too.
Colour contrast
Good colour contrast is essential for accessibility, especially for individuals with poor vision or in situations where visibility is compromised, such as sunlight glare on screens.
The foreground and background colours you use must meet contrast ratio guidelines. This is to ensure there is enough contrast between text and its background so that it can be read by people with low vision who do not use contrast-enhancing assistive technology.
The visual presentation of text and images of text has a contrast ratio of at least 4.5:1, except for the following:
- Large-scale text and images of large-scale text have a contrast ratio of at least 3:1. Large-scale text is called as is 14 point (18.66px) and bold or larger, or 18 point (24px) or larger.
- Text or images of text that are purely decorative have no contrast requirement.
- Text that is part of a logo or brand name has no contrast requirement.
NHS Colour Combinations
See which NHS Colour Combinations meet colour contrast guidelines.
This achieves WCAG 2.1 Success Criterion 1.4.3 Contrast (Minimium)
Check your colour contrast
Use WebAIM's Contrast Checker tool to check whether your foreground and background colours pass.