Color Contrast

Color contrast is the light-dark difference between text and its background. A contrast ratio expresses that difference as a number. The Web Content Accessibility Guidelines (WCAG) set a minimum of 4.5:1 for most web text, with a lower minimum for large text and exceptions for certain content. Try checking one text-and-background pair with a contrast checker.

Contrast checks use relative luminance, a measure of a color's relative brightness. A contrast ratio compares the relative luminance of text and its background using a standardized calculation. Color names alone cannot establish the result, and a ratio of 4.5:1 does not simply mean that one color is 4.5 times brighter than the other.

WCAG Success Criterion 1.4.3, its minimum text-contrast requirement, generally requires at least 4.5:1 for text and images of text—words stored as an image. Large text requires at least 3:1. Large means at least 18 points, a measure of font size, or 14 points when bold, or equivalent sizing for Chinese, Japanese and Korean fonts. The criterion also covers placeholder text and text displayed when someone points to or selects a control using a keyboard. [1]

Exceptions cover text in inactive controls, pure decoration, text invisible to everyone, and text within pictures containing significant other visual content. Logo and brand-name text also has an exception, but deliberately fading an otherwise sufficiently contrasting logo is not automatically exempt. Brand colors do not exempt ordinary text. Non-text graphics and symbols are addressed by a separate criterion. [1]

Imagine a hypothetical website with small pale-orange instructions on white. Suppose a contrast checker reports 4.499:1 for the specified colors: this falls below 4.5:1 and must not be rounded up to pass. Adjust the colors and check again. If the website offers light and dark presentations, check the text-background pairs in each; a mode's name does not establish its contrast. [1]

For evaluation, use the text and background colors specified in the page rather than sampling softened letter edges. Font smoothing, also called anti-aliasing, softens those edges and can make thin lettering appear fainter. The guidance recommends stronger letter strokes or contrast above the minimum when this causes problems. [1]

These thresholds are minimum requirements for this criterion, not promises of effortless reading for everyone. The supplied document explains accessibility guidance; it is not an experiment demonstrating universal benefits. Passing a contrast check alone does not establish overall accessibility or legal compliance.

• Guidance on scope: Success Criterion 1.4.3 generally requires at least 4.5:1 for text and images of text, or 3:1 for large text, subject to its stated exceptions. These are minimum thresholds, not universal readability guarantees. [1]
• Guidance on testing: Computed contrast values must not be rounded up to meet a threshold. Evaluate the specified foreground and background colors rather than colors sampled from smoothed text edges. [1]
• Conditional guidance on customization: Authors may offer user-selected color combinations below the minimum if a mechanism allows users to return to colors that meet the required values. The document presents this as an accommodation for differing needs, not an experimentally established benefit for everyone. [1]

The supplied Understanding document is informative guidance explaining the criterion, not an experimental study or a legal compliance guarantee. It notes that thin or unusual fonts can appear faint despite a nominally passing color pair. Its text-contrast requirements do not supply the requirements for non-text graphics. The former bibliography entry labeled “Contrast Minimum (Understanding Level AAA)” was misidentified and is replaced here by the supplied guidance for Success Criterion 1.4.3 at Level AA, a WCAG conformance level; the document identifies enhanced contrast separately as Success Criterion 1.4.6. The old ISO entry is not retained as a separately verified source. [1]