Adding WCAG Conformance Logos
W3C provides conformance logos for Web Content Accessibility Guidelines (WCAG) 2. Content providers can use these logos on their sites to indicate a claim of conformance to a specified conformance level of WCAG.
Note that these logos do not represent review or validation of conformance by W3C and/or WAI.
Conformance to WCAG 2 is defined in the Conformance section of WCAG. Here is the excerpt that defines the conformance levels:
- For Level A conformance (the minimum level of conformance), the Web page satisfies all the Level A Success Criteria, or a conforming alternate version is provided.
- For Level AA conformance, the Web page satisfies all the Level A and Level AA Success Criteria, or a Level AA conforming alternate version is provided.
- For Level AAA conformance, the Web page satisfies all the Level A, Level AA and Level AAA Success Criteria, or a Level AAA conforming alternate version is provided.
Please see WCAG 2 Conformance section for more information on what is required in a conformance claim.
How to use the logos
Place the icon for the appropriate conformance level using the HTML source code below.
WCAG 2.2
WCAG 2.2 Level A Conformance
Put the following HTML markup in your page:
<a href="https://www.w3.org/WAI/WCAG2A-Conformance"
title="Explanation of WCAG 2 Level A Conformance">
<img height="32" width="88"
src="https://www.w3.org/WAI/WCAG22/wcag2.2A"
alt="Level A conformance,
W3C WAI Web Content Accessibility Guidelines 2.2">
</a>
If you would like to use the blue logo, append “-blue” to the image src.
WCAG 2.2 Level AA Conformance
Put the following HTML markup in your page:
<a href="https://www.w3.org/WAI/WCAG2AA-Conformance"
title="Explanation of WCAG 2 Level AA conformance">
<img height="32" width="88"
src="https://www.w3.org/WAI/WCAG22/wcag2.2AA"
alt="Level AA conformance,
W3C WAI Web Content Accessibility Guidelines 2.2">
</a>
If you would like to use the blue logo, append “-blue” to the image src.
WCAG 2.2 Level AAA Conformance
Put the following HTML markup in your page:
<a href="https://www.w3.org/WAI/WCAG2AAA-Conformance"
title="Explanation of WCAG 2 Level AAA conformance">
<img height="32" width="88"
src="https://www.w3.org/WAI/WCAG22/wcag2.2AAA"
alt="Level AAA conformance,
W3C WAI Web Content Accessibility Guidelines 2.2">
</a>
If you would like to use the blue logo, append “-blue” to the image src.
WCAG 2.1
WCAG 2.1 Level A Conformance
Put the following HTML markup in your page:
<a href="https://www.w3.org/WAI/WCAG2A-Conformance"
title="Explanation of WCAG 2 Level A Conformance">
<img height="32" width="88"
src="https://www.w3.org/WAI/WCAG21/wcag2.1A-v"
alt="Level A conformance,
W3C WAI Web Content Accessibility Guidelines 2.1">
</a>
If you would like to use the blue logo, append “-blue” to the image src.
WCAG 2.1 Level AA Conformance
Put the following HTML markup in your page:
<a href="https://www.w3.org/WAI/WCAG2AA-Conformance"
title="Explanation of WCAG 2 Level AA conformance">
<img height="32" width="88"
src="https://www.w3.org/WAI/WCAG21/wcag2.1AA-v"
alt="Level AA conformance,
W3C WAI Web Content Accessibility Guidelines 2.1">
</a>
If you would like to use the blue logo, append “-blue” to the image src.
WCAG 2.1 Level AAA Conformance
Put the following HTML markup in your page:
<a href="https://www.w3.org/WAI/WCAG2AAA-Conformance"
title="Explanation of WCAG 2 Level AAA conformance">
<img height="32" width="88"
src="https://www.w3.org/WAI/WCAG21/wcag2.1AAA-v"
alt="Level AAA conformance,
W3C WAI Web Content Accessibility Guidelines 2.1">
</a>
If you would like to use the blue logo, append “-blue” to the image src.
WCAG 2.0
WCAG 2.0 Level A Conformance
Put the following HTML markup in your page:
<a href="https://www.w3.org/WAI/WCAG2A-Conformance"
title="Explanation of WCAG 2 Level A Conformance">
<img height="32" width="88"
src="https://www.w3.org/WAI/wcag2A"
alt="Level A conformance,
W3C WAI Web Content Accessibility Guidelines 2.0">
</a>
If you would like to use the blue logo, append “-blue” to the image src.
WCAG 2.0 Level AA Conformance
Put the following HTML markup in your page:
<a href="https://www.w3.org/WAI/WCAG2AA-Conformance"
title="Explanation of WCAG 2 Level AA conformance">
<img height="32" width="88"
src="https://www.w3.org/WAI/wcag2AA"
alt="Level AA conformance,
W3C WAI Web Content Accessibility Guidelines 2.0">
</a>
If you would like to use the blue logo, append “-blue” to the image src.
WCAG 2.0 Level AAA Conformance
Put the following HTML markup in your page:
<a href="https://www.w3.org/WAI/WCAG2AAA-Conformance"
title="Explanation of WCAG 2 Level AAA conformance">
<img height="32" width="88"
src="https://www.w3.org/WAI/wcag2AAA"
alt="Level AAA conformance,
W3C WAI Web Content Accessibility Guidelines 2.0">
</a>
If you would like to use the blue logo, append “-blue” to the image src.
Logos
The blue and gold colors do not indicate any difference. We offer the two options for flexibility with your visual design.
Below are the logos as they will appear in your site.
You may also choose to download and use local copies of the logos, using the links provided for each logo. You will have to adjust the HTML accordingly, and please use the same alternative text and link for the logo.
WCAG 2.2 Logos
| A | AA | AAA | |
|---|---|---|---|
| Gold |  (png, gif, svg, eps) |
 (png, gif, svg, eps) |
 (png, gif, svg, eps) |
| Blue |  (png, gif, svg, eps) |
 (png, gif, svg, eps) |
 (png, gif, svg, eps) |
WCAG 2.1 Logos
| A | AA | AAA | |
|---|---|---|---|
| Gold |  (png, gif, svg, eps) |
 (png, gif, svg, eps) |
 (png, gif, svg, eps) |
| Blue |  (png, gif, svg, eps) |
 (png, gif, svg, eps) |
 (png, gif, svg, eps) |
WCAG 2.0 Logos
| A | AA | AAA | |
|---|---|---|---|
| Gold | (png, gif, svg, eps) |
(png, gif, svg, eps) |
(png, gif, svg, eps) |
| Blue | (png, gif, svg, eps) |
(png, gif, svg, eps) |
(png, gif, svg, eps) |
Responsibility for accuracy of claims
Content providers are solely responsible for the use of these logos. Before using these logos as part of a conformance claim, we recommend that the provider understand Web Content Accessibility Guidelines (WCAG) 2 and sufficiently evaluate accessibility to ensure that pages using this logo meet the conformance level claimed. Providers should also ensure that anyone maintaining or updating the site is familiar with WCAG and the logo use, and either re-reviews the page or removes the logo from the page if they are unsure whether it still meets a specified conformance level.
Please note that use of this logo is not based on an automated test. No tool alone can determine if a page conforms to WCAG requirements. Sometimes evaluation tools can produce false or misleading results. Knowledgeable human evaluation is required to determine if a page is accessible. For these reasons, the logos on this page are used to indicate only a claim of conformance made by thorough evaluation, not only tool evaluation.
Scope of the claim
By default, a conformance icon refers to a single page. If the claim is meant to apply to include more than one page, the conformance icon must be accompanied by explicit scope information explaining which pages are covered by the claim.
Back to Top