HTML Accessibility Checker
Paste HTML or open a file and check it against WCAG 2.2. The page is rendered in a private sandbox and tested with the axe-core engine (or a built-in rule set when offline), listing each problem with its impact, the exact element and how to fix it.
Last updated:
How to use the HTML Accessibility Checker
- Paste your HTML into the editor, or click Open file to load an .html file. A sample with common mistakes is loaded to start.
- Choose the standard: WCAG 2.2 AA is what most laws and policies reference. Tick Best practices for extra advice.
- Click Check accessibility. The HTML is rendered in a sandbox (scripts removed) and tested.
- Review the issues, sorted from critical to minor. Each one shows the element, why it fails and how to fix it. Click Show to highlight it in the preview.
- Fix and re-check until the list is clear, then copy or download the report.
The WCAG criteria most often failed in HTML
WCAG (Web Content Accessibility Guidelines) is the W3C standard behind laws and policies such as the ADA guidance in the US, Section 508 and the European Accessibility Act. Version 2.2 has 86 success criteria at three levels: A (minimum), AA (the usual legal target) and AAA (enhanced). The table lists the automated checks that catch the most real-world problems.
| Criterion | Level | What it requires | Typical failure |
|---|---|---|---|
| 1.1.1 Non-text Content | A | Text alternatives for images and image buttons | <img> without alt; icon button with no name |
| 1.3.1 Info and Relationships | A | Structure is in the markup, not just the visuals | <div> directly inside <ul>; labels not tied to fields |
| 1.3.5 Identify Input Purpose | AA | Personal-data fields use valid autocomplete values | autocomplete="date-range" (not a real token) |
| 1.4.3 Contrast (Minimum) | AA | 4.5:1 for text, 3:1 for large text | Light gray text on white |
| 2.4.2 Page Titled | A | A descriptive <title> | Missing or "Untitled" title |
| 2.4.4 Link Purpose | A | Link purpose is clear from its text or context | Empty links, icon-only links |
| 2.5.8 Target Size (Minimum) | AA | Click/tap targets at least 24 × 24 px or well spaced | Tiny close buttons |
| 3.1.1 Language of Page | A | lang on the <html> element | <html> with no lang |
| 4.1.2 Name, Role, Value | A | Controls expose a name and a valid role | Unlabeled inputs, invalid role values |
How color contrast is calculated
Each color's relative luminance is computed from its sRGB channels: every channel is divided by 255, linearized (values up to 0.04045 are divided by 12.92, others use ((v + 0.055) / 1.055)2.4), and combined as L = 0.2126 R + 0.7152 G + 0.0722 B. The contrast ratio is (Llighter + 0.05) / (Ldarker + 0.05), from 1:1 (no contrast) to 21:1 (black on white). This checker reads the computed text color and walks up the page to find the background, blending any semi-transparent layers. Text over images or gradients is listed under manual review because the background cannot be measured reliably.
What automated testing cannot tell you
- Alt text quality: a tool can see that
altexists, not whether it describes the image well. - Keyboard use: tab through the page. Every control should be reachable, in a sensible order, with a visible focus indicator and no traps.
- Screen reader output: try NVDA or JAWS on Windows, VoiceOver on Mac and iPhone, or TalkBack on Android.
- Zoom and reflow: zoom to 200% and 400% and check that nothing is cut off or overlapping.
- Media: check that captions are accurate and that videos have audio description where needed.
- Dynamic content: scripts are removed here, so test menus, dialogs and error messages in the real page.
Frequently asked questions
What does this HTML accessibility checker test?
It renders your HTML and checks it against WCAG 2.2 success criteria such as text alternatives for images (1.1.1), info and relationships (1.3.1), contrast (1.4.3), page titles (2.4.2), link purpose (2.4.4), page language (3.1.1) and name, role, value (4.1.2), plus optional best practices like heading order and landmarks.
Does passing this check mean my page is fully accessible?
No. Automated tools can reliably find roughly a third to a half of accessibility problems. Things like meaningful alt text, logical reading order, keyboard traps, focus visibility and captions quality still need a manual review with a keyboard and a screen reader.
What is axe-core?
axe-core is a widely used open-source accessibility testing engine maintained by Deque Systems. This tool loads it from a public CDN and runs it inside a sandboxed frame. If it cannot load, a built-in rule set covering the most common WCAG failures is used instead, and the report says which engine ran.
What do the impact levels mean?
Critical issues block some users completely (for example an unlabeled form field or an image button with no name). Serious issues cause major difficulty, moderate issues cause some difficulty, and minor issues are annoyances or best-practice gaps. Fix critical and serious first.
Is my HTML uploaded?
No. The HTML is rendered in an iframe on this page, with scripts and event handlers stripped out, and all checks run in your browser. Images or stylesheets linked by full URLs are loaded by the browser just like any web page.
Why are my JavaScript-generated elements missing?
Scripts are removed before rendering for safety, so content built by JavaScript does not appear. Paste the rendered HTML instead: in your browser's developer tools, right-click the <html> element and copy its outer HTML.
What contrast ratio does WCAG require?
Level AA requires at least 4.5:1 for normal text and 3:1 for large text (24px, or 18.66px bold, and larger). Level AAA requires 7:1 and 4.5:1. The ratio is (L1 + 0.05) / (L2 + 0.05), where L1 and L2 are the relative luminances of the lighter and darker colors.
Are all the tools on FreeToolCabin tested for quality and accuracy?
Yes! Every tool on our site undergoes automated Q/A testing in real browser environments to ensure high precision, correct output, and zero errors. If you happen to spot a bug or have a suggestion, please contact us at [email protected] and our team will review it right away.