What does WCAG 2.2 require for colour and contrast?

At a glance

Current standard

WCAG 2.2, W3C Recommendation (12 December 2024 version)

ISO equivalent

ISO/IEC 40500:2025

Colour criteria

1.4.1 (A) · 1.4.3 (AA) · 1.4.6 (AAA) · 1.4.11 (AA)

WCAG 3

Working Draft only (10 September 2026)

What the standard is, and which version counts

WCAG is published by the W3C. Version 2.2 became a Recommendation in 2023 and the version currently on the W3C site is dated 12 December 2024. ISO and IEC have published the same text as ISO/IEC 40500:2025, which lets procurement rules cite an ISO number for WCAG 2.2. Laws and policies often lag: many still reference WCAG 2.0 or 2.1, and because 2.2 is backwards-compatible in its contrast rules, content that meets 2.2 at Level AA also meets the earlier versions' colour requirements. WCAG 3 is a separate project with a different structure; it is a Working Draft and nothing in it is a requirement.

Contrast ratio: a formula, not a judgement

Contrast in WCAG 2 is a ratio of relative luminances, (L1 + 0.05) / (L2 + 0.05), where L is computed from sRGB values and the lighter colour goes on top. The 0.05 terms stand in for ambient flare on a screen. The ratio runs from 1:1 (identical) to 21:1 (black on white). It deliberately ignores hue: red and green of equal luminance score 1:1 even though people with typical vision see them as very different, because for people with a red–green colour-vision deficiency they may be nearly the same. 'Large text' means at least 18 point, or 14 point bold, roughly 24 and 18.7 CSS pixels.

The thresholds are bright lines. #767676 on white passes 4.5:1; #777777, one step lighter, does not. The table on this page is computed with the same formula the contrast checker uses.

Use of colour and non-text contrast

Criterion 1.4.1 is not about contrast at all. It says colour cannot be the only visual means of conveying information, indicating an action, prompting a response or distinguishing an element — so a link that differs from surrounding text only by hue, or a form error shown only by a red border, fails unless something else (an underline, an icon, text) carries the same message. Criterion 1.4.11, added in WCAG 2.1, extends contrast to things that are not text: the visual boundary of a text input, the state of a checkbox, the lines and segments of a chart that are needed to understand it. These need 3:1 against whatever they sit next to.

What the numbers do not cover

WCAG contrast is measured on the colour values, not on a real screen in a real room. Glare, a dimmed phone, a cheap panel's gamma, or a dark-mode overlay can all reduce effective contrast below what the numbers promise. The formula is also known to over-rate some combinations, particularly light text on mid-tone colours, and to under-rate others, which is the motivation for alternative models discussed in the WCAG 3 drafts. None of that changes what WCAG 2.2 requires today. For checking specific pairs, the site's contrast checker applies the formula exactly; broader guidance on designing accessible colour lives on the accessibility pages.

The data

What goes wrong, and what to do

How to check it yourself

1. Put each text/background pair through the contrast checker and note whether text is large or normal.
2. Check controls, focus indicators and chart elements against their neighbours at 3:1.
3. Switch the page to greyscale; anything that loses its meaning relies on colour alone and needs a second cue.
4. Record which WCAG version a contract or law names, since some still cite 2.0 or 2.1.

What the evidence says

Each statement is labelled by kind — established fact, a standard’s requirement, observed market data, a convention, or Colourwise’s own interpretation or analysis — with the strength of the evidence behind it.

• StandardStrong evidence

  WCAG 2.2 requires a contrast ratio of at least 4.5:1 for text (3:1 for large-scale text) at Level AA, at least 7:1 (4.5:1 for large-scale text) at Level AAA, and 3:1 for user-interface components and graphical objects under criterion 1.4.11.

  Source: Web Content Accessibility Guidelines (WCAG) 2.2; International Organization for Standardization (ISO) catalogue

• StandardStrong evidence

  WCAG defines large-scale text as at least 18 point, or 14 point bold, or an equivalent size for Chinese, Japanese and Korean fonts.

  Source: Web Content Accessibility Guidelines (WCAG) 2.2; International Organization for Standardization (ISO) catalogue

• FactStrong evidence

  ISO/IEC 40500:2025 publishes WCAG 2.2 as an ISO/IEC standard.

  Source: European Standards online catalogue (EN, ISO, IEC, BSI, ASTM listings); International Organization for Standardization (ISO) catalogue

• FactStrong evidence

  WCAG 3.0 is a W3C Working Draft, most recently dated 10 September 2026, and is not a standard.

  Source: W3C Accessibility Guidelines (WCAG) 3.0 — Working Draft

• Colourwise analysisStrong evidence

  Pure red (#FF0000) on white has a WCAG contrast ratio of about 4:1, enough for large text but not for body text at Level AA.

  Based on: Computed by Colourwise with the WCAG 2.2 relative-luminance and contrast-ratio definitions; see the table on this page.

  Source: Web Content Accessibility Guidelines (WCAG) 2.2; International Organization for Standardization (ISO) catalogue

Related questions

Is WCAG 2.2 the same as ISO/IEC 40500?

ISO/IEC 40500:2025 publishes the WCAG 2.2 text as an international standard. The earlier ISO/IEC 40500:2012 was WCAG 2.0, which is why older procurement documents may point to a different version.

Does WCAG 3 change the 4.5:1 contrast rule?

Not yet. WCAG 3 is a working draft whose contrast method is still under discussion; until it becomes a Recommendation, the 4.5:1 and 3:1 thresholds of WCAG 2.2 remain the reference.

Why does red on white fail WCAG for normal text?

Pure red has a relative luminance of about 0.21, so against white the ratio is only about 4:1 — below 4.5:1. A darker red passes; the hue itself is not the problem.

Related topics

Go further

Sources

• Web Content Accessibility Guidelines (WCAG) 2.2 — W3C Web Accessibility Initiative (WAI) (Official standard or government)
• International Organization for Standardization (ISO) catalogue — ISO (Standards body)
• European Standards online catalogue (EN, ISO, IEC, BSI, ASTM listings) — European Standards s.r.o. (Reference work)
• W3C Accessibility Guidelines (WCAG) 3.0 — Working Draft — W3C (World Wide Web Consortium) (Official standard or government)

Reviewed 29 September 2026. Colourwise summarises its sources in its own words and does not reproduce standards text or proprietary colour data. Spotted an error? Tell us.