Accessibility MCP Server

Accessibility MCP Server

Provides comprehensive accessibility auditing tools for websites using axe-core, Lighthouse CLI, and WAVE API. Returns deterministic, WCAG-mapped results with selectors and DOM context for remediation.

Category
Visit Server

README

Accessibility MCP Server

An MCP (Model Context Protocol) server that provides accessibility auditing tools for LLMs through Cursor. Integrates axe-core (via Playwright), Lighthouse CLI, and optional WAVE API to deliver deterministic, machine-actionable accessibility audit results.

Features

  • axe-core Integration: Automated accessibility testing via Playwright with full WCAG 2.1/2.2 coverage
  • Lighthouse CLI: Comprehensive accessibility audits with performance insights
  • WAVE API: Optional integration for additional accessibility validation
  • Deterministic Output: All results normalised to explicit pass/fail/unknown outcomes
  • WCAG Compliance: Every finding mapped to WCAG 2.1/2.2 criteria with severity classification
  • Machine-Actionable: Results include selectors and DOM context for remediation
  • Type-Safe: Full TypeScript implementation with strict type checking

Installation

# Clone the repository
git clone <repository-url>
cd accessibility-mcp

# Install dependencies
npm install

# Build the project
npm run build

# Install Playwright browsers (required for axe-core)
npx playwright install chromium

Configuration

Create a .env file in the project root (see .env.example for template):

# WAVE API Configuration (optional)
WAVE_API_KEY=your_wave_api_key_here
WAVE_API_URL=https://wave.webaim.org/api/request

# Lighthouse Configuration (optional)
LIGHTHOUSE_TIMEOUT=60000
LIGHTHOUSE_CHROME_FLAGS=--headless --no-sandbox

# Playwright Configuration (optional)
PLAYWRIGHT_BROWSER=chromium
PLAYWRIGHT_TIMEOUT=30000

Usage

As MCP Server in Cursor

  1. Build the project: npm run build
  2. Configure in Cursor's MCP settings (~/.cursor/mcp.json or Cursor settings):
{
  "mcpServers": {
    "accessibility": {
      "command": "node",
      "args": ["/absolute/path/to/accessibility-mcp/dist/index.js"]
    }
  }
}
  1. Restart Cursor to load the MCP server

Available MCP Tools

axe_audit

Run an accessibility audit using axe-core via Playwright. Supports URLs, local file paths, and localhost URLs.

Parameters:

  • url (required): The URL to audit. Can be:
    • HTTP/HTTPS URL: "https://example.com" or "http://localhost:3000"
    • Local file path: "./index.html" or "/path/to/file.html"
    • File protocol URL: "file:///path/to/file.html"
  • options (optional): Configuration object
    • tags: Array of WCAG tags (e.g., ["wcag2a", "wcag2aa"])
    • rules: Object with rule-specific configuration
    • timeout: Timeout in milliseconds (default: 30000)
    • browser: Browser to use - "chromium", "firefox", or "webkit" (default: "chromium")

Examples:

{
  "name": "axe_audit",
  "arguments": {
    "url": "https://example.com",
    "options": {
      "tags": ["wcag2a", "wcag2aa"],
      "browser": "chromium"
    }
  }
}
{
  "name": "axe_audit",
  "arguments": {
    "url": "./src/index.html"
  }
}
{
  "name": "axe_audit",
  "arguments": {
    "url": "http://localhost:3000"
  }
}

lighthouse_audit

Run an accessibility audit using Lighthouse CLI. Supports URLs, local file paths, and localhost URLs.

Parameters:

  • url (required): The URL to audit. Can be:
    • HTTP/HTTPS URL: "https://example.com" or "http://localhost:3000"
    • Local file path: "./index.html" or "/path/to/file.html"
    • File protocol URL: "file:///path/to/file.html"
  • categories (optional): Array of Lighthouse categories to include
  • options (optional): Configuration object
    • onlyCategories: Array of categories to include
    • skipAudits: Array of audit IDs to skip
    • timeout: Timeout in milliseconds (default: 60000)

Examples:

{
  "name": "lighthouse_audit",
  "arguments": {
    "url": "https://example.com",
    "categories": ["accessibility"]
  }
}
{
  "name": "lighthouse_audit",
  "arguments": {
    "url": "./dist/index.html"
  }
}

wave_audit

Run an accessibility audit using WAVE API (requires API key). Supports URLs and localhost URLs. Local files are automatically served via a temporary local server.

Parameters:

  • url (required): The URL to audit. Can be:
    • HTTP/HTTPS URL: "https://example.com" or "http://localhost:3000"
    • Local file path: "./index.html" (will be served via temporary server)
  • apiKey (optional): WAVE API key (uses WAVE_API_KEY env var if not provided)

Examples:

{
  "name": "wave_audit",
  "arguments": {
    "url": "https://example.com",
    "apiKey": "your_api_key"
  }
}
{
  "name": "wave_audit",
  "arguments": {
    "url": "./src/index.html"
  }
}

Note: For local files, the MCP server automatically creates a temporary HTTP server to serve the file, as WAVE API requires HTTP/HTTPS URLs.

Output Format

All tools return normalised results in the following format:

{
  url: string;
  tool: 'axe' | 'lighthouse' | 'wave';
  timestamp: string;
  results: Array<{
    rule_id: string;
    wcag_ref: string[];
    severity: 'critical' | 'serious' | 'moderate' | 'minor';
    confidence: 'high' | 'medium' | 'low';
    outcome: 'pass' | 'fail' | 'unknown';
    selector: string;
    dom_context: string;
    message: string;
    reason_code?: string; // Required when outcome is 'unknown'
  }>;
  summary: {
    total: number;
    pass: number;
    fail: number;
    unknown: number;
    by_severity: {
      critical: number;
      serious: number;
      moderate: number;
      minor: number;
    };
  };
}

Development

Prerequisites

  • Node.js 18.0.0 or higher
  • npm or yarn

Scripts

# Development mode (with hot reload)
npm run dev

# Build TypeScript to JavaScript
npm run build

# Run all tests
npm test

# Run unit tests only
npm run test:unit

# Run integration tests only
npm run test:integration

# Type check without building
npm run type-check

# Lint code
npm run lint

Project Structure

accessibility-mcp/
├── .cursor/
│   ├── rules/          # Cursor behavioural constraints
│   └── commands/       # Cursor repeatable actions
├── src/
│   ├── adapters/       # External tool adapters (axe, Lighthouse, WAVE)
│   ├── services/       # Business logic (audits, normalisation)
│   ├── tools/          # MCP tool definitions
│   ├── types/          # TypeScript type definitions
│   ├── utils/          # Utility functions (WCAG mappings, selectors)
│   ├── index.ts        # Entry point
│   └── server.ts       # MCP server setup
├── tests/
│   ├── fixtures/       # Test data fixtures
│   ├── unit/           # Unit tests
│   └── integration/    # Integration tests
└── dist/               # Compiled JavaScript output

Architecture

The server follows a clean architecture pattern:

  1. Tools Layer (src/tools/): MCP tool definitions that expose audit capabilities
  2. Services Layer (src/services/): Business logic for audit execution and result normalisation
  3. Adapters Layer (src/adapters/): Interface layer for external tools (axe, Lighthouse, WAVE)
  4. Types Layer (src/types/): Shared type definitions for audit results and normalised outputs

Adding a New Audit Tool

See .cursor/commands/add-new-audit-tool.md for detailed instructions on adding a new accessibility audit tool.

Testing

# Run all tests
npm test

# Run with coverage
npm test -- --coverage

# Run specific test file
npm test tests/unit/normaliser.test.ts

CI/CD Integration

The project includes commands for CI/CD integration. See .cursor/commands/ci-gate-accessibility.md for details on setting up accessibility gates in your CI pipeline.

Contributing

  1. Follow the architectural constraints defined in .cursor/rules/
  2. Ensure all code passes type checking: npm run type-check
  3. Write tests for new features
  4. Ensure deterministic outputs (see .cursor/rules/determinism.md)
  5. Map all findings to WCAG criteria (see .cursor/rules/accessibility.md)

License

MIT

Acknowledgments

Recommended Servers

playwright-mcp

playwright-mcp

A Model Context Protocol server that enables LLMs to interact with web pages through structured accessibility snapshots without requiring vision models or screenshots.

Official
Featured
TypeScript
Magic Component Platform (MCP)

Magic Component Platform (MCP)

An AI-powered tool that generates modern UI components from natural language descriptions, integrating with popular IDEs to streamline UI development workflow.

Official
Featured
Local
TypeScript
Audiense Insights MCP Server

Audiense Insights MCP Server

Enables interaction with Audiense Insights accounts via the Model Context Protocol, facilitating the extraction and analysis of marketing insights and audience data including demographics, behavior, and influencer engagement.

Official
Featured
Local
TypeScript
VeyraX MCP

VeyraX MCP

Single MCP tool to connect all your favorite tools: Gmail, Calendar and 40 more.

Official
Featured
Local
Kagi MCP Server

Kagi MCP Server

An MCP server that integrates Kagi search capabilities with Claude AI, enabling Claude to perform real-time web searches when answering questions that require up-to-date information.

Official
Featured
Python
graphlit-mcp-server

graphlit-mcp-server

The Model Context Protocol (MCP) Server enables integration between MCP clients and the Graphlit service. Ingest anything from Slack to Gmail to podcast feeds, in addition to web crawling, into a Graphlit project - and then retrieve relevant contents from the MCP client.

Official
Featured
TypeScript
Qdrant Server

Qdrant Server

This repository is an example of how to create a MCP server for Qdrant, a vector search engine.

Official
Featured
Neon Database

Neon Database

MCP server for interacting with Neon Management API and databases

Official
Featured
Exa Search

Exa Search

A Model Context Protocol (MCP) server lets AI assistants like Claude use the Exa AI Search API for web searches. This setup allows AI models to get real-time web information in a safe and controlled way.

Official
Featured
E2B

E2B

Using MCP to run code via e2b.

Official
Featured