mcp-accessibility-scanner — Claude Code MCP server: web a11y audits
Runs axe checks, a Tab walkthrough and an accessibility-tree pass from inside your agent. Useful before shipping a page.
claude mcp add mcp-accessibility-scanner -- npx -y mcp-accessibility-scannerWhat mcp-accessibility-scanner does
The server drives a Playwright browser and points axe-core at whatever page you name. Your agent can open a URL, scan the markup, step through interactive elements with Tab, and write the findings to JSON with node details and links to fixes. Add annotateScreenshot: true to scan_page and you also get a full-page PNG with the problems marked up. audit_screen_reader reads the accessibility tree, accessible names and element geometry. It never launches an actual screen reader, so manual testing still has to happen.
Install Google Chrome first — the npm package does not bring a browser. The install line is npm install -g mcp-accessibility-scanner --allow-scripts=re2, and that flag exists so the native re2 module can build. Skip it and the server dies with Cannot find module './build/Release/re2.node'. No prebuilt binary means you need a native build toolchain. A Docker Hub image with Chromium inside is also available.
Then register the server as a stdio process in your client's MCP config, with --headless, --isolated and --output-dir ./a11y-output. --isolated spins up a clean browser profile instead of touching your own Chrome session. Output paths resolve against the server's working directory, so pass an absolute --output-dir if your client starts it somewhere else. Automated checks do not certify WCAG compliance — read the coverage warnings and note which page states you never exercised.
What it helps with
- spot images that ship without alt text
- check text contrast before a release
- trace where keyboard focus disappears during Tab
- hand the team a JSON report of violations
- inspect accessible names on a form's fields
Example prompts for the agent
- Open
http://localhost:3000and runscan_pagewithannotateScreenshot: true - Run
audit_keyboardwithmaxTabs: 30and show me where focus jumps wrong - Run
audit_screen_readerand check the accessible names on the buttons
How to install mcp-accessibility-scanner
Platform CLI
claude mcp add mcp-accessibility-scanner -- npx -y mcp-accessibility-scannerPlatform CLI
codex mcp add mcp-accessibility-scanner -- npx -y mcp-accessibility-scannerConfig file
{
"mcpServers": {
"mcp-accessibility-scanner": {
"command": "npx",
"args": [
"-y",
"mcp-accessibility-scanner"
]
}
}
}Config file
{
"servers": {
"mcp-accessibility-scanner": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"mcp-accessibility-scanner"
]
}
}
}Platform CLI
gemini mcp add mcp-accessibility-scanner npx -y mcp-accessibility-scannerStep by step, with commands for each platform: How to add an MCP server to Claude Code, Codex, Cursor, VS Code, Gemini CLI and more
Questions about mcp-accessibility-scanner
How do I install mcp-accessibility-scanner in Claude Code?
Run claude mcp add mcp-accessibility-scanner -- npx -y mcp-accessibility-scanner, then restart or reconnect the client.
What does mcp-accessibility-scanner do?
It loads a page in a browser and runs axe-core checks: contrast, ARIA, forms, keyboard navigation. Findings come back as text and as saved JSON reports.
What does the server need to run?
Google Chrome installed, since the npm package ships no browser. It also needs the native re2 module, which is why a global install takes --allow-scripts=re2.
