home / mcp / wcag mcp server

WCAG MCP Server

Provides WCAG 2.2 data, Understanding docs, techniques, and glossary via MCP endpoints

Installation
Add the following to your MCP client configuration file.

Configuration

View docs
{
  "mcpServers": {
    "joe-watkins-wcag-mcp": {
      "command": "npx",
      "args": [
        "mcp-remote@next",
        "https://your-site.netlify.app/mcp"
      ]
    }
  }
}

You can access WCAG 2.2 coverage, complete Understanding documentation, techniques, and glossary data through a Model Context Protocol (MCP) server. This setup lets you query WCAG criteria, read detailed explanations, and experiment with accessibility guidance directly from your environment or remote hosting, all via MCP clients.

How to use

You interact with the WCAG MCP server from an MCP client. Start by configuring your client to point to the remote MCP endpoint when you prefer a hosted solution, or run a local instance for offline or private use. You can request full criteria details, browse guidelines, and pull the complete Understanding documentation for each success criterion. Use the provided tools to search, filter, and retrieve specific criterion text, context, or related resources.

Key usage patterns you can perform include: querying the list of WCAG principles and guidelines, retrieving all success criteria with optional filters, obtaining detailed criterion context including techniques, and looking up glossary terms. You can also access the 9 new WCAG 2.2 criteria and explore a library of techniques and failure patterns. The remote server configuration uses a standard MCP setup so you can integrate it with your existing MCP tooling.

How to install

Prerequisites: Node.js is installed on your machine. You may also need npm or npx for local execution and dependency management.

Step 1: Clone the project repository with submodules to ensure WCAG data and Understanding docs are included.

Step 2: Install dependencies and fetch data.

Step 3: Build and start the MCP server locally or deploy to a remote host.

Step 4: Configure your MCP client to point to the local server or the remote endpoint.

# Clone with submodules
git clone --recurse-submodules https://github.com/joe-watkins/wcag-mcp.git
cd wcag-mcp

# Install dependencies and build data (fetches WCAG data and Understanding docs)
npm install

# If you need to update data and Understanding docs later
npm run build

# Start the local MCP server (example; exact command may vary by setup)
npm run start

# If you plan to deploy to Netlify or another host, follow your deployment steps after building data.

Deployment and remote access

You can run a remote MCP endpoint and connect your MCP client to it. The recommended remote setup uses an MCP client to access a pre-built endpoint via Netlify Function hosting. The following example shows an MCP JSON configuration for a remote-access setup.

{
  "mcpServers": {
    "wcag_mcp": {
      "type": "stdio",
      "command": "npx",
      "args": ["mcp-remote@next", "https://your-site.netlify.app/mcp"]
    }
  }
}

Notes about configuration, security, and troubleshooting

Configure MCP clients in your development environment by adding the server entry to your client settings. If you use a remote endpoint, ensure the URL is reachable from your network and that any required authentication or tokens are configured as environment variables in your MCP client.

If you encounter connectivity issues, verify that the remote endpoint is up, the MCP server is reachable, and your network allows traffic to the endpoint. For local runs, confirm that Node.js is installed and that dependencies were built successfully using the npm install and npm run build steps.

Available tools

list-principles

Lists all four WCAG 2.2 principles (Perceivable, Operable, Understandable, Robust)

list-guidelines

Lists WCAG 2.2 guidelines, optionally filtered by principle number (1-4)

list-success-criteria

Lists success criteria with optional filters by level (A/AA/AAA), guideline, or principle

get-success-criteria-detail

Gets just the normative success criterion text and exceptions without Understanding docs

get-criterion

Gets comprehensive details including full Understanding documentation (intent, benefits, examples)

get-guideline

Gets full details for a specific guideline including all its success criteria

search-wcag

Searches success criteria by keyword in titles and descriptions

get-criteria-by-level

Gets all criteria for a conformance level, optionally including lower levels

count-criteria

Returns counts of success criteria grouped by level, principle, or guideline

list-techniques

Lists techniques, filter by technology (html, aria, css, pdf, general) or type

get-technique

Gets details for a specific technique by ID (e.g., "H37", "ARIA1", "G94")

get-techniques-for-criterion

Gets all techniques (sufficient, advisory, failure) for a success criterion

search-techniques

Searches techniques by keyword

get-failures-for-criterion

Gets failure patterns (common mistakes) for a success criterion

get-glossary-term

Gets the definition of a WCAG term (e.g., "programmatically determined")

list-glossary-terms

Lists all 101 WCAG glossary terms

search-glossary

Searches the glossary by keyword

whats-new-in-wcag22

Lists all 9 success criteria added in WCAG 2.2

get-full-criterion-context

Gets comprehensive context: SC + techniques

get-server-info

Returns server information and statistics