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;
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.
Text that is part of a logo or brand name has no contrast requirement.
This success criterion requires that the texts and image of texts that are regular in size meet the color contrast ratio of 4.5:1 against their background color. For the large or large scale texts, this SC mandates at least 3:1 against their background. This requirement solely relies on the content authors, designers and the developers and the user agents or contrast enhancing assistive technology, be it at the system level or independent.
Differentiators for the regular/large text
Based on different research and books, WCAG defines a large text which uses 18 PT font or 14 PT bold text. To put into CSS pixels, 1 PT=1.333 CSS PX and therefore, 14 PT bold and 18 PT are 18.5 PX and 24 PX approximately. Anything below these font size requirement is considered regular text and therefore must meet 4.5:1 ratio.
These specificities are arrived at so that it covers people with moderately low vision who don’t use any assistive technology to enhance the contrast and people who have color deficiency too. Moreover, large texts are easily readable in lower contrast.
The contrast minimum excludes the following in meeting the contrast requirements:
Points to Ponder
Let your site be a feast to the eyes and not a strain!