The purpose of this success criterion is to provide adequate contrast between text and its background so that people with moderately low vision (who do not use contrast-enhancing assistive technology) can read it easily. For people that do not have color deficiencies, hue and saturation have little or no effect on legibility as assessed by reading performance (Knoblauch et al., 1991).
Color deficiencies can affect luminance contrast to a certain degree. Therefore, in the recommendation, the contrast is calculated in such a way that color is not the fundamental factor so that people who have a color vision deficit will also have enough contrast between the text and background.
Texts that are larger and have wider character strokes are easier to read at lower contrast. The contrast requirement for larger texts is therefore lower. Decorative text that conveys no information is excluded.
Table of Contents
Official Requirements
Success Criterion 1.4.3 Contrast (Minimum) (Level AA): 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 contrast requirement.
Why is it required?
A good contrast between the text on your website and the background color is beneficial to all users. Some people with visual impairments require a stronger contrast than others to understand your content, hence making use of appropriate colors is essential.
How do we fix it?
- Ensure that you specify both text and background color, and make sure they have enough contrast between them.
- If you are using a background image, make sure the part of the image lying below the text provides adequate contrast.
- Your visitors must be provided a control to be able to switch to a higher contrast presentation.
- Do not set the text color nor the background, the visitors should be allowed to use their browser defaults.
Exceptions
- Text that is 18 points or larger (or 14 points or larger, if bold) has a lower minimum contract ratio of 3:1
- Text that is entirely decorative
- Text that is an accompanying part of an image (For instance, a woman who is reading a newspaper or a landscape that happens to include a street sign)
- Brand logos
