Web Accessibility MCP Server

Web Accessibility MCP Server is an MCP server that provides automated web accessibility evaluation and color blindness simulation using axe-core and Puppeteer. It connects AI assistants like Claude to a headless browser environment to scan web pages against WCAG guidelines. Web developers, accessibility specialists, QA engineers, and compliance auditors use this tool to identify digital accessibility barriers directly within their AI coding workflows. The server enables automated execution of accessibility audits, reporting violations with impact levels, descriptions, and failing HTML nodes. Additionally, it applies color matrix transformations across web pages to simulate vision deficiencies including protanopia, deuteranopia, and tritanopia, outputting screenshot files of the simulated views. Users can supply custom user agents and wait for specific CSS selectors before analysis, ensuring dynamic web applications render properly prior to audit execution. This provides structured accessibility data and visual evidence for remediating interface compliance defects.

Category: Browser & Web Automation

Tags: accessibility, axe-core, compliance, puppeteer, web-testing

Visit Web Accessibility MCP Server

How to install and configure Web Accessibility MCP Server

1. Ensure Node.js (v14 or higher) and npm are installed. 2. Install via Smithery for Claude Desktop: bash npx -y @smithery/cli install @bilhasry-deriv/mcp-web-a11y --client claude 3. Alternatively, clone the repository, run npm install, and execute npm run build. 4. Add the server configuration to your MCP settings file (such as cline_mcp_settings.json): json { "mcpServers": { "web-a11y": { "command": "node", "args": ["/path/to/mcp-web-a11y/build/index.js"], "disabled": false, "autoApprove": [], "env": { "MCP_OUTPUT_DIR": "/path/to/output/directory" } } } } 5. Specify an absolute path for MCP_OUTPUT_DIR to save generated screenshots.

What you can do with Web Accessibility MCP Server

• Audit web pages against WCAG guidelines using axe-core and retrieve categorized violations with impact ratings and affected elements. * Simulate protanopia, deuteranopia, or tritanopia color blindness on web pages and export rendered screenshots to evaluate contrast. * Analyze dynamically rendered single-page applications by instructing the tool to wait for specific CSS selectors before running checks. * Inspect web accessibility using custom user agents to verify compliance across specific mobile or desktop browser configurations. * Retrieve violation summaries and fix guidance to accelerate developer remediation directly inside an AI-assisted coding environment.

Key facts

• Open Source
• https://github.com/bilhasry-deriv/mcp-web-a11y
• Browser & Web Automation, Security & Compliance
• accessibility, axe-core, compliance, puppeteer, web-testing

Part of MCP Servers

How do I install Web Accessibility MCP Server?

You can install it automatically for Claude Desktop using Smithery with the command npx -y @smithery/cli install @bilhasry-deriv/mcp-web-a11y --client claude. Alternatively, clone the repository, run npm install, run npm run build, and add the compiled index.js path to your MCP client configuration settings.

What tools are included in Web Accessibility MCP Server?

The server includes two primary tools: check_accessibility and simulate_colorblind. The check_accessibility tool audits URLs for WCAG violations using axe-core, while simulate_colorblind applies color matrix transformations to generate screenshots representing protanopia, deuteranopia, or tritanopia.

Which MCP clients work with Web Accessibility MCP Server?

It works with MCP-compatible clients such as Claude Desktop and Cline. Any client that supports standard Model Context Protocol server configurations and can execute Node.js background processes can register and communicate with this server.

Why is the MCP_OUTPUT_DIR environment variable required?

The MCP_OUTPUT_DIR environment variable defines the directory where screenshot files generated by the simulate_colorblind tool are stored. If configured in your MCP client settings, it must use an absolute path so the server can write the image files properly.

Is Web Accessibility MCP Server open source?

Yes, Web Accessibility MCP Server is open source. It is published on GitHub and licensed under the MIT License.