Description
a11y-debugging is an agent skill that uses the Chrome DevTools MCP server to find and fix accessibility problems in a web page. It audits pages against web.dev accessibility guidelines and covers semantic HTML, ARIA labels and focus behaviour. The skill starts with a Lighthouse accessibility audit to get a baseline score and a list of failing elements with remediation advice. It then uses the accessibility tree, which the snapshot tool returns, as the most reliable picture of what assistive technologies see. The skill explains that hiding an element visually with a CSS rule, such as opacity 0, is not the same as hiding it with display none or aria-hidden, which screen readers treat differently. When it needs to check a guideline, it reads the raw markdown version of the web.dev article rather than the rendered page. Page-scoped tools need a page ID, which the skill gets from the list of open pages or from a newly created one. You need the Chrome DevTools MCP server connected to your agent to use it. The skill is published in the chromedevtools/chrome-devtools-mcp repository, which has about 53,600 stars on GitHub.…
Highlights
- Lighthouse accessibility audit for a baseline
- Checks semantic HTML, ARIA labels and focus
- Uses the accessibility tree as the source of truth
- Reads web.dev guidelines as raw markdown
- Needs the Chrome DevTools MCP server
Ratings & Reviews
No ratings yet
Be the first to rate a11y-debugging.
People also visit
screen-reader-testing
Test web applications with screen readers including VoiceOver, NVDA, and JAWS
a11y-debugging FAQ
What does this skill do?
It helps an agent debug and audit the accessibility of a web page through the Chrome DevTools MCP server, based on web.dev guidelines.
Where does it start?
With an automated Lighthouse accessibility audit, which gives a score and lists failing elements with remediation advice.
What does it check?
Semantic HTML, ARIA labels and focus behaviour, using the accessibility tree the snapshot tool returns.
What does it need?
The Chrome DevTools MCP server connected to your agent, and a page ID from the open pages.
How do I install it?
Run npx skills add https://github.com/chromedevtools/chrome-devtools-mcp --skill a11y-debugging.
Is it free and checked for security?
The listing shows it as free. Its security audits show passes from Gen Agent Trust Hub and Socket, and a warning from Snyk.
What are the best a11y-debugging alternatives?
Popular alternatives to a11y-debugging include screen-reader-testing, frontend-a11y and react-testing. See all a11y-debugging alternatives