Happy slice of mcp pizzaMCP.pizza
Fire in da houseTop Tip:Paying $100+ per month for Perplexity, MidJourney, Runway, ChatGPT and other tools is crazy - get all your AI tools in one site starting at $15 per month with Galaxy AI Fire in da houseCheck it out free

a11ymcp

MCP.Pizza Chef: ronantakizawa

a11ymcp is an MCP server that integrates web accessibility testing APIs with LLMs. It leverages Deque's Axe-core API and Puppeteer to analyze web pages and HTML snippets for WCAG compliance, identifying accessibility issues in real time. This server empowers developers and AI workflows to automatically assess and improve web content accessibility, ensuring adherence to standards and enhancing user experience for all users.

Use This MCP server To

Test public URLs for web accessibility compliance Analyze raw HTML snippets for accessibility issues Automate WCAG compliance checks in web development Integrate accessibility testing into AI-powered workflows Generate accessibility reports from web content Identify and highlight accessibility violations in real time Support developers in fixing accessibility bugs efficiently

README

Web Accessibility-Testing MCP Server (A11y MCP)

smithery badge

a11ymcpwide

A11y MCP is an MCP (Model Context Protocol) server that gives LLMs access to web accessibility testing APIs.

This server uses the Deque Axe-core API and Puppeteer to allow LLMs to analyze web content for WCAG compliance and identify accessibility issues.

NOTE: This is not an official MCP server from Deque Labs.

Leave a star if you enjoyed the project! 🌟

Features

  • Test web pages: Test any public URL for accessibility issues
  • Test HTML snippets: Test raw HTML strings for accessibility issues
  • WCAG compliance testing: Check content against various WCAG standards (2.0, 2.1, 2.2)
  • Customizable tests: Specify which accessibility tags/standards to test against
  • Rule exploration: Get information about available accessibility rules
  • Color contrast analysis: Check color combinations for WCAG compliance
  • ARIA validation: Test proper usage of ARIA attributes
  • Orientation lock detection: Identify content that forces specific screen orientations

Installation

To use this server with Claude Desktop, you need to configure it in the MCP settings:

For macOS: Edit the file at '~/Library/Application Support/Claude/claude_desktop_config.json'

{
  "mcpServers": {
    "a11y-accessibility": {
    "command": "npx",
    "args": [
      "-y",
      "a11y-mcp-server"
    ]
   }
  }
}

For Windows: Edit the file at %APPDATA%\Claude\settings\claude_mcp_settings.json

For Linux: Edit the file at ~/.config/Claude/settings/claude_mcp_settings.json Replace /path/to/axe-mcp-server/build/index.js with the actual path to your compiled server file.

Available Tools

test_accessibility

Tests a URL for accessibility issues.

Parameters:

  • url (required): The URL of the web page to test
  • tags (optional): Array of WCAG tags to test against (e.g., ["wcag2aa"])

Example

{
 "url": "https://example.com",
 "tags": ["wcag2aa"]
}

test_html_string

Tests an HTML string for accessibility issues. Parameters:

  • html (required): The HTML content to test
  • tags (optional): Array of WCAG tags to test against (e.g., ["wcag2aa"])

Example

", "tags": ["wcag2aa"] }">
{
  "html": "<div><img src='image.jpg'></div>",
  "tags": ["wcag2aa"]
}

get_rules

Get information about available accessibility rules with optional filtering.

check_color_contrast

Check if a foreground and background color combination meets WCAG contrast requirements.

Parameters:

  • foreground (required): Foreground color in hex format (e.g., "#000000")
  • background (required): Background color in hex format (e.g., "#FFFFFF")
  • fontSize (optional): Font size in pixels (default: 16)
  • isBold (optional): Whether the text is bold (default: false)

Example

{
  "foreground": "#777777",
  "background": "#EEEEEE",
  "fontSize": 16,
  "isBold": false
}

check_color_contrast

Check if ARIA attributes are used correctly in HTML.

Parameters:

  • html (required): HTML content to test for ARIA attribute usage

Example

{
  "html": "<div role='button' aria-pressed='false'>Click me</div>"
}

check_orientation_lock

Check if content forces a specific orientation.

Parameters:

  • html (required): HTML content to test for orientation lock issues

Example

{
  "html": "<html><head><meta name='viewport' content='width=device-width, orientation=portrait'></head><body>Content</body></html>"
}

Response Format

The server returns accessibility test results in a structured JSON format:

{
  "violations": [
    {
      "id": "color-contrast",
      "impact": "serious",
      "description": "Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds",
      "help": "Elements must meet minimum color contrast ratio thresholds",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/color-contrast",
      "affectedNodes": [
        {
          "html": "<div style=\"color: #aaa; background-color: #eee;\">Low contrast text</div>",
          "target": ["div"],
          "failureSummary": "Fix any of the following: Element has insufficient color contrast of 1.98 (foreground color: #aaa, background color: #eee, font size: 12.0pt, font weight: normal)"
        }
      ]
    }
  ],
  "passes": 1,
  "incomplete": 0,
  "inapplicable": 2,
  "timestamp": "2025-04-25T16:45:33.655Z",
  "url": "about:blank",
  "testEngine": {
    "name": "axe-core",
    "version": "4.10.3"
  },
  "testRunner": {
    "name": "axe"
  },
  "testEnvironment": {
    "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) HeadlessChrome/135.0.0.0 Safari/537.36",
    "windowWidth": 800,
    "windowHeight": 600,
    "orientationAngle": 0,
    "orientationType": "portrait-primary"
  }
}

Dependencies

  • @modelcontextprotocol/sdk
  • puppeteer
  • @axe-core/puppeteer
  • axe-core

a11ymcp FAQ

How does a11ymcp test web accessibility?
It uses Deque's Axe-core API combined with Puppeteer to scan web pages and HTML snippets for WCAG compliance and accessibility issues.
Can a11ymcp test both live websites and HTML code?
Yes, it supports testing of any public URL as well as raw HTML strings.
Is a11ymcp an official Deque Labs product?
No, a11ymcp is an independent MCP server and not officially affiliated with Deque Labs.
How can I integrate a11ymcp with my AI workflows?
You can connect it as an MCP server to provide LLMs with real-time accessibility testing capabilities during content analysis or generation.
Does a11ymcp support all WCAG standards?
It focuses on WCAG compliance testing using Axe-core, which covers a broad range of WCAG 2.x guidelines.
What technologies does a11ymcp rely on?
It uses Puppeteer for web page rendering and Axe-core API for accessibility analysis.
Can a11ymcp generate detailed accessibility reports?
Yes, it can output structured data on accessibility violations for further processing or reporting.
Is it possible to extend a11ymcp for custom accessibility rules?
While primarily built on Axe-core, developers can potentially customize or extend its capabilities by modifying the server code.