### Build and Run a11y-mcp Server from Source

Source: https://context7.com/ronantakizawa/a11ymcp/llms.txt

Steps to install dependencies, build the TypeScript code to JavaScript, and start the a11y-mcp server from its source code.

```bash
npm install
npm run build        # compiles TypeScript → dist/
npm start            # runs dist/index.js via stdio
```

--------------------------------

### Test Accessibility with Mobile Viewport

Source: https://github.com/ronantakizawa/a11ymcp/blob/main/README.md

Use the 'test_accessibility' tool to check a given URL for accessibility issues against WCAG 2.0 AA standards. This example specifies a mobile viewport size, simulating an iPhone 12/13.

```json
{
  "url": "https://example.com",
  "tags": ["wcag2aa"],
  "width": 390,
  "height": 844
}
```

--------------------------------

### Test Accessibility with Default Viewport

Source: https://github.com/ronantakizawa/a11ymcp/blob/main/README.md

Use the 'test_accessibility' tool to check a given URL for accessibility issues against WCAG 2.0 AA standards. This example uses the default desktop viewport dimensions.

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

--------------------------------

### Example Accessibility Test Response

Source: https://github.com/ronantakizawa/a11ymcp/blob/main/README.md

This JSON structure represents the typical response format for accessibility test results, detailing violations, passes, and other metrics.

```json
{
  "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"
  }
}
```

--------------------------------

### Get All Available Rules

Source: https://github.com/ronantakizawa/a11ymcp/blob/main/README.md

Retrieve all available accessibility rules without any filtering. This is useful for understanding the full scope of checks provided by the API.

```json
{}
```

--------------------------------

### Verify Claude Code MCP Server Registration

Source: https://github.com/ronantakizawa/a11ymcp/blob/main/README.md

List all registered MCP servers in Claude Code to verify that the A11y MCP server has been successfully added. This command helps confirm the installation.

```bash
claude mcp list
```

--------------------------------

### Build and Run a11y-mcp Server with Docker

Source: https://context7.com/ronantakizawa/a11ymcp/llms.txt

Instructions for building a Docker image for the a11y-mcp server and running it. This is suitable for headless Chrome environments.

```bash
docker build -t a11y-mcp .
docker run --rm a11y-mcp
```

--------------------------------

### get_rules

Source: https://context7.com/ronantakizawa/a11ymcp/llms.txt

Lists available Axe-core accessibility rules, optionally filtered by WCAG tag. Returns metadata for each rule including ID, description, help text, help URL, and tags.

```APIDOC
## Tool: `get_rules` — List available Axe-core accessibility rules

Returns metadata for all Axe-core rules, optionally filtered by WCAG tag. Each rule entry includes its ID, description, help text, help URL, and associated tags. Useful for discovering which rules are active for a given compliance level before running a full test.

### Request Example (Get all rules tagged wcag21aa)
```json
{
  "tool": "get_rules",
  "arguments": {
    "tags": ["wcag21aa"]
  }
}
```

### Response Example (Excerpt)
```json
{
  "rules": [
    {
      "ruleId": "color-contrast",
      "description": "Ensures 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",
      "tags": ["cat.color", "wcag2aa", "wcag21aa", "wcag143", "TTv5", "TT13.c", "EN-301-549", "ACT"]
    },
    {
      "ruleId": "label",
      "description": "Ensures every form element has a label",
      "help": "Form elements must have labels",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/label",
      "tags": ["cat.forms", "wcag2a", "wcag21aa", "wcag412", "section508", "section508.22.n"]
    }
  ]
}
```

### Request Example (Get all rules without filtering)
```json
{
  "tool": "get_rules",
  "arguments": {}
}
```
```

--------------------------------

### Test a live URL for WCAG violations

Source: https://context7.com/ronantakizawa/a11ymcp/llms.txt

Use this tool to audit a live website for accessibility issues. It launches a headless browser, navigates to the URL, and runs Axe-core. Configure WCAG tags and viewport dimensions for specific testing scenarios.

```json
{
  "tool": "test_accessibility",
  "arguments": {
    "url": "https://example.com",
    "tags": ["wcag2aa"],
    "width": 1280,
    "height": 800
  }
}
```

```json
{
  "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": "<p style=\"color:#aaa\">Low contrast text</p>",
          "target": ["p"],
          "failureSummary": "Fix any of the following: Element has insufficient color contrast of 1.98"
        }
      ]
    }
  ],
  "passes": 38,
  "incomplete": 2,
  "inapplicable": 14,
  "timestamp": "2025-01-15T10:23:45.123Z",
  "url": "https://example.com",
  "testEngine": {
    "name": "axe-core",
    "version": "4.10.3"
  }
}
```

```json
// Mobile viewport test (iPhone 12/13)
{
  "tool": "test_accessibility",
  "arguments": {
    "url": "https://example.com",
    "tags": ["wcag21aa"],
    "width": 390,
    "height": 844
  }
}
```

--------------------------------

### Check Color Contrast

Source: https://github.com/ronantakizawa/a11ymcp/blob/main/README.md

Verify if a foreground and background color combination meets WCAG contrast requirements. Optional parameters include font size and boldness.

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

--------------------------------

### Test HTML String with Default Viewport

Source: https://github.com/ronantakizawa/a11ymcp/blob/main/README.md

Use this to test HTML content for accessibility issues within a default 1280x800 viewport. Specify WCAG tags for targeted testing.

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

--------------------------------

### check_color_contrast

Source: https://github.com/ronantakizawa/a11ymcp/blob/main/README.md

Checks if a foreground and background color combination meets WCAG contrast requirements, considering font size and weight.

```APIDOC
## check_color_contrast

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

### Parameters
#### Path Parameters
None

#### Query Parameters
None

#### Request Body
- **foreground** (string) - Required - Foreground color (e.g., `"#000000"`, `"rgb(0,0,0)"`)
- **background** (string) - Required - Background color (e.g., `"#FFFFFF"`, `"rgb(255,255,255)"`)
- **fontSize** (integer) - Optional - Font size in pixels (default: 16)
- **isBold** (boolean) - Optional - Whether the text is bold (default: false)

### Request Example
```json
{
  "foreground": "#777777",
  "background": "#EEEEEE",
  "fontSize": 16,
  "isBold": false
}
```

### Response
#### Success Response (200)
(See general Response Format below)

#### Response Example
(See general Response Format below)
```

--------------------------------

### test_html_string

Source: https://context7.com/ronantakizawa/a11ymcp/llms.txt

Tests raw HTML markup for accessibility issues by loading the HTML string into a headless browser and running Axe-core against it. Supports WCAG tag filters and viewport customization, making it ideal for testing components or generated markup.

```APIDOC
## Tool: `test_html_string` — Test raw HTML markup for accessibility issues

Accepts an HTML string, loads it into a headless browser via `page.setContent()`, and runs Axe-core against it. Ideal for testing components, templates, or generated markup before deployment. Supports the same WCAG tag filters and viewport customization as `test_accessibility`.

### Request Example (Test a form component)
```json
{
  "tool": "test_html_string",
  "arguments": {
    "html": "<form><label>Name</label><input type='text' /></form>",
    "tags": ["wcag2aa"]
  }
}
```

### Response Example (Label not associated with input)
```json
{
  "violations": [
    {
      "id": "label",
      "impact": "critical",
      "description": "Ensures every form element has a label",
      "help": "Form elements must have labels",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/label",
      "affectedNodes": [
        {
          "html": "<input type=\"text\">",
          "target": ["input"],
          "failureSummary": "Fix any of the following: Form element does not have an implicit (wrapped) <label>; Form element does not have an explicit <label>"
        }
      ]
    }
  ],
  "passes": 12,
  "incomplete": 0,
  "inapplicable": 27,
  "timestamp": "2025-01-15T10:25:00.000Z",
  "url": "about:blank",
  "testEngine": { "name": "axe-core", "version": "4.10.3" }
}
```

### Request Example (Fixed version - passes label rule)
```json
{
  "tool": "test_html_string",
  "arguments": {
    "html": "<form><label for='name'>Name</label><input id='name' type='text' /></form>",
    "tags": ["wcag2aa"]
  }
}
```
```

--------------------------------

### test_accessibility

Source: https://context7.com/ronantakizawa/a11ymcp/llms.txt

Tests a live URL for WCAG violations by launching a headless Chromium browser, navigating to the URL, and running Axe-core against the rendered DOM. Supports WCAG tag filters and customizable viewport dimensions for desktop and mobile testing.

```APIDOC
## Tool: `test_accessibility` — Test a live URL for WCAG violations

Launches a headless Chromium browser via Puppeteer, navigates to the given URL (waiting for `networkidle0`), and runs Axe-core against the fully rendered DOM. Accepts optional WCAG tag filters and viewport dimensions so you can simulate desktop or mobile environments. Returns a structured list of violations with per-node HTML snippets and failure summaries, plus counts of passing, incomplete, and inapplicable rules.

### Request Example (Standard)
```json
{
  "tool": "test_accessibility",
  "arguments": {
    "url": "https://example.com",
    "tags": ["wcag2aa"],
    "width": 1280,
    "height": 800
  }
}
```

### Response Example (Standard)
```json
{
  "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": "<p style=\"color:#aaa\">Low contrast text</p>",
          "target": ["p"],
          "failureSummary": "Fix any of the following: Element has insufficient color contrast of 1.98"
        }
      ]
    }
  ],
  "passes": 38,
  "incomplete": 2,
  "inapplicable": 14,
  "timestamp": "2025-01-15T10:23:45.123Z",
  "url": "https://example.com",
  "testEngine": {
    "name": "axe-core",
    "version": "4.10.3"
  }
}
```

### Request Example (Mobile viewport test - iPhone 12/13)
```json
{
  "tool": "test_accessibility",
  "arguments": {
    "url": "https://example.com",
    "tags": ["wcag21aa"],
    "width": 390,
    "height": 844
  }
}
```
```

--------------------------------

### Test raw HTML markup for accessibility issues

Source: https://context7.com/ronantakizawa/a11ymcp/llms.txt

Use this tool to test isolated HTML snippets, such as components or templates, before deployment. It loads the HTML into a headless browser and runs Axe-core, supporting the same WCAG tag filters and viewport customization as the URL testing tool.

```json
// MCP tool call — test a form component
{
  "tool": "test_html_string",
  "arguments": {
    "html": "<form><label>Name</label><input type='text' /></form>",
    "tags": ["wcag2aa"]
  }
}
```

```json
{
  "violations": [
    {
      "id": "label",
      "impact": "critical",
      "description": "Ensures every form element has a label",
      "help": "Form elements must have labels",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/label",
      "affectedNodes": [
        {
          "html": "<input type=\"text\">",
          "target": ["input"],
          "failureSummary": "Fix any of the following: Form element does not have an implicit (wrapped) <label>; Form element does not have an explicit <label>"
        }
      ]
    }
  ],
  "passes": 12,
  "incomplete": 0,
  "inapplicable": 27,
  "timestamp": "2025-01-15T10:25:00.000Z",
  "url": "about:blank",
  "testEngine": { "name": "axe-core", "version": "4.10.3" }
}
```

```json
// Fixed version — passes label rule
{
  "tool": "test_html_string",
  "arguments": {
    "html": "<form><label for='name'>Name</label><input id='name' type='text' /></form>",
    "tags": ["wcag2aa"]
  }
}
```

--------------------------------

### check_color_contrast

Source: https://context7.com/ronantakizawa/a11ymcp/llms.txt

Validates a color pair against WCAG contrast ratios, considering font size and boldness. Calculates the contrast ratio and evaluates compliance against WCAG 2 AA and AAA thresholds.

```APIDOC
## Tool: `check_color_contrast` — Validate a color pair against WCAG contrast ratios

Parses foreground and background colors (hex, RGB, or HSV), calculates the WCAG luminance-based contrast ratio, and evaluates compliance against WCAG 2 AA and AAA thresholds. Accounts for font size and boldness when determining whether text qualifies as "large text" (which has a lower required ratio). Uses both direct luminance calculation and Axe-core's internal engine for cross-validation.

### Request Example (Check a gray-on-light-gray combination)
```json
{
  "tool": "check_color_contrast",
  "arguments": {
    "foreground": "#777777",
    "background": "#EEEEEE",
    "fontSize": 16,
    "isBold": false
  }
}
```

### Response Example (Fails AA: ratio 4.48, needs 4.5)
```json
{
  "originalInput": {
    "foreground": "#777777",
    "background": "#EEEEEE"
  },
  "normalizedColors": {
    "foregroundHex": "#777777",
    "backgroundHex": "#eeeeee",
    "foregroundRgb": "rgb(119, 119, 119)",
    "backgroundRgb": "rgb(238, 238, 238)"
  },
  "fontSize": 16,
  "isBold": false,
  "contrastRatio": 4.48,
  "calculationMethod": "direct-calculation",
  "isLargeText": false,
  "passesWCAG2AA": false,
  "requiredRatioForAA": 4.5,
  "requiredRatioForAAA": 7.0,
  "passesWCAG2AAA": false,
  "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/color-contrast"
}
```

### Request Example (Test with HSV color input and large bold text)
```json
{
  "tool": "check_color_contrast",
  "arguments": {
    "foreground": "hsv(0, 0%, 20%)",
    "background": "#FFFFFF",
    "fontSize": 18,
    "isBold": true
  }
}
```

### Supported color formats: `#RGB`, `#RRGGBB`, `rgb(r,g,b)`, `hsv(h,s%,v%)`
```

--------------------------------

### Configure Claude Desktop MCP Server

Source: https://github.com/ronantakizawa/a11ymcp/blob/main/README.md

Add the A11y MCP server configuration to your Claude Desktop MCP configuration file. This enables accessibility testing within the desktop client.

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

--------------------------------

### List Axe-core Rules by WCAG Tag

Source: https://context7.com/ronantakizawa/a11ymcp/llms.txt

Retrieve metadata for all Axe-core rules, optionally filtering by WCAG tags like 'wcag21aa'. Useful for understanding active rules for specific compliance levels.

```json
{
  "tool": "get_rules",
  "arguments": {
    "tags": ["wcag21aa"]
  }
}
```

```json
{
  "rules": [
    {
      "ruleId": "color-contrast",
      "description": "Ensures 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",
      "tags": ["cat.color", "wcag2aa", "wcag21aa", "wcag143", "TTv5", "TT13.c", "EN-301-549", "ACT"]
    },
    {
      "ruleId": "label",
      "description": "Ensures every form element has a label",
      "help": "Form elements must have labels",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/label",
      "tags": ["cat.forms", "wcag2a", "wcag21aa", "wcag412", "section508", "section508.22.n"]
    }
  ]
}
```

```json
{
  "tool": "get_rules",
  "arguments": {}
}
```

--------------------------------

### Test HTML String with Mobile Viewport

Source: https://github.com/ronantakizawa/a11ymcp/blob/main/README.md

Use this to test HTML content for accessibility issues within a mobile-specific viewport (375x812 pixels). Specify WCAG tags for targeted testing.

```json
{
  "html": "<div><img src='image.jpg'></div>",
  "tags": ["wcag2aa"],
  "width": 375,
  "height": 812
}
```

--------------------------------

### get_rules

Source: https://github.com/ronantakizawa/a11ymcp/blob/main/README.md

Retrieves information about available accessibility rules, with optional filtering by tags.

```APIDOC
## get_rules

### Description
Get information about available accessibility rules with optional filtering. Returns an array of rule objects, each containing `ruleId`, `description`, `help`, `helpUrl`, and `tags`.

### Parameters
#### Path Parameters
None

#### Query Parameters
None

#### Request Body
- **tags** (array of strings) - Optional - Filter rules by tags (e.g., `["wcag2a", "wcag2aa", "best-practice"]`)

### Request Example
```json
{
  "tags": ["wcag21aa"]
}
```

### Response
#### Success Response (200)
- **ruleId** (string) - The unique identifier for the rule.
- **description** (string) - A brief description of the accessibility issue.
- **help** (string) - Guidance on how to fix the issue.
- **helpUrl** (string) - A URL with more information about the rule.
- **tags** (array of strings) - Tags associated with the rule.

#### Response Example
```json
[
  {
    "ruleId": "color-contrast",
    "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",
    "tags": ["wcag2aa", "wcag21aa"]
  }
]
```
```

--------------------------------

### Register Claude Code MCP Server (Project Scope)

Source: https://github.com/ronantakizawa/a11ymcp/blob/main/README.md

Register the A11y MCP server for the current project using the Claude Code CLI. This command makes the accessibility testing tools available within the project context.

```bash
claude mcp add a11y-accessibility -- npx -y a11y-mcp-server
```

--------------------------------

### test_accessibility

Source: https://github.com/ronantakizawa/a11ymcp/blob/main/README.md

Tests a URL for accessibility issues using specified WCAG tags and viewport dimensions.

```APIDOC
## test_accessibility

### Description
Tests a URL for accessibility issues.

### Parameters
#### Path Parameters
None

#### Query Parameters
None

#### Request Body
- **url** (string) - Required - The URL of the web page to test
- **tags** (array of strings) - Optional - Array of WCAG tags to test against (e.g., `["wcag2aa"]`)
- **width** (integer) - Optional - Viewport width in pixels (default: 1280)
- **height** (integer) - Optional - Viewport height in pixels (default: 800)

### Request Example
```json
{
  "url": "https://example.com",
  "tags": ["wcag2aa"]
}
```

### Request Example (Mobile Viewport)
```json
{
  "url": "https://example.com",
  "tags": ["wcag2aa"],
  "width": 390,
  "height": 844
}
```

### Response
#### Success Response (200)
(Response schema not provided in source)

#### Response Example
(Response example not provided in source)
```

--------------------------------

### Configure VS Code MCP Server

Source: https://github.com/ronantakizawa/a11ymcp/blob/main/README.md

Add the A11y MCP server configuration to your VS Code settings.json file. This integrates accessibility testing capabilities into your VS Code environment.

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

--------------------------------

### Check Orientation Lock

Source: https://github.com/ronantakizawa/a11ymcp/blob/main/README.md

Determine if the provided HTML content enforces a specific screen orientation. This is important for responsive design and user experience.

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

--------------------------------

### test_html_string

Source: https://github.com/ronantakizawa/a11ymcp/blob/main/README.md

Tests an HTML string for accessibility issues against specified WCAG tags and viewport dimensions.

```APIDOC
## test_html_string

### Description
Tests an HTML string for accessibility issues.

### Parameters
#### Path Parameters
None

#### Query Parameters
None

#### Request Body
- **html** (string) - Required - The HTML content to test
- **tags** (array of strings) - Optional - Array of WCAG tags to test against (e.g., `["wcag2aa"]`)
- **width** (integer) - Optional - Viewport width in pixels (default: 1280)
- **height** (integer) - Optional - Viewport height in pixels (default: 800)

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

### Response
#### Success Response (200)
(See general Response Format below)

#### Response Example
(See general Response Format below)
```

--------------------------------

### Register Claude Code MCP Server (User Scope)

Source: https://github.com/ronantakizawa/a11ymcp/blob/main/README.md

Register the A11y MCP server globally for your user account using the Claude Code CLI. This makes accessibility testing tools available across all your projects.

```bash
claude mcp add --scope user a11y-accessibility -- npx -y a11y-mcp-server
```

--------------------------------

### Check for Portrait Orientation Lock via Meta Viewport

Source: https://context7.com/ronantakizawa/a11ymcp/llms.txt

Use this JSON payload to check if a page locks to portrait orientation using the meta viewport tag. The expected response indicates whether an orientation lock is detected and provides details on viewport issues.

```json
{
  "tool": "check_orientation_lock",
  "arguments": {
    "html": "<!DOCTYPE html><html><head><meta name='viewport' content='width=device-width, orientation=portrait'></head><body><p>Content</p></body></html>"
  }
}
```

```json
{
  "hasOrientationLock": true,
  "viewportIssues": [
    {
      "id": "meta-viewport",
      "impact": "critical",
      "description": "Ensures <meta name='viewport'> does not disable text scaling and zooming",
      "help": "Zooming and scaling must not be disabled",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/meta-viewport",
      "affectedNodes": [
        {
          "html": "<meta name=\"viewport\" content=\"width=device-width, orientation=portrait\">",
          "target": ["meta"],
          "failureSummary": "Fix any of the following: user-scalable=no on <meta> tag disables zooming on mobile devices"
        }
      ]
    }
  ],
  "hasCssOrientationLock": false,
  "wcagCriteria": "WCAG 2.1 SC 1.3.4 (Orientation)",
  "helpUrl": "https://www.w3.org/WAI/WCAG21/Understanding/orientation.html"
}
```

--------------------------------

### Validate ARIA Attributes in HTML

Source: https://context7.com/ronantakizawa/a11ymcp/llms.txt

Perform a focused Axe-core analysis on ARIA role and attribute usage within provided HTML. Identifies violations and passing checks for eight specific ARIA rules.

```json
{
  "tool": "check_aria_attributes",
  "arguments": {
    "html": "<div role='button' aria-pressed='false' tabindex='0'>Toggle</div>"
  }
}
```

```json
{
  "violations": [],
  "passes": [
    {
      "id": "aria-allowed-attr",
      "description": "Ensures an element's role supports its ARIA attributes",
      "help": "Elements must only use supported ARIA attributes",
      "nodes": 1
    },
    {
      "id": "aria-valid-attr-value",
      "description": "Ensures all ARIA attributes have valid values",
      "help": "ARIA attributes must conform to valid values",
      "nodes": 1
    }
  ]
}
```

```json
{
  "tool": "check_aria_attributes",
  "arguments": {
    "html": "<a href='#' role='link' aria-pressed='true'>Back</a>"
  }
}
```

```json
{
  "violations": [
    {
      "id": "aria-allowed-attr",
      "impact": "critical",
      "description": "Ensures an element's role supports its ARIA attributes",
      "help": "Elements must only use supported ARIA attributes",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-allowed-attr",
      "affectedNodes": [
        {
          "html": "<a href=\"#\" role=\"link\" aria-pressed=\"true\">Back</a>",
          "target": ["a"],
          "failureSummary": "Fix any of the following: ARIA attribute is not allowed: aria-pressed=\"true\""
        }
      ]
    }
  ],
  "passes": []
}
```

--------------------------------

### Check ARIA Attributes

Source: https://github.com/ronantakizawa/a11ymcp/blob/main/README.md

Validate the correct usage of ARIA attributes within provided HTML content. This ensures proper accessibility for assistive technologies.

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

--------------------------------

### Check Color Contrast Against WCAG Standards

Source: https://context7.com/ronantakizawa/a11ymcp/llms.txt

Validate a color pair against WCAG contrast ratios, considering font size and boldness. Supports hex, RGB, and HSV color formats. Provides results for WCAG 2 AA and AAA compliance.

```json
{
  "tool": "check_color_contrast",
  "arguments": {
    "foreground": "#777777",
    "background": "#EEEEEE",
    "fontSize": 16,
    "isBold": false
  }
}
```

```json
{
  "originalInput": {
    "foreground": "#777777",
    "background": "#EEEEEE"
  },
  "normalizedColors": {
    "foregroundHex": "#777777",
    "backgroundHex": "#eeeeee",
    "foregroundRgb": "rgb(119, 119, 119)",
    "backgroundRgb": "rgb(238, 238, 238)"
  },
  "fontSize": 16,
  "isBold": false,
  "contrastRatio": 4.48,
  "calculationMethod": "direct-calculation",
  "isLargeText": false,
  "passesWCAG2AA": false,
  "requiredRatioForAA": 4.5,
  "requiredRatioForAAA": 7.0,
  "passesWCAG2AAA": false,
  "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/color-contrast"
}
```

```json
{
  "tool": "check_color_contrast",
  "arguments": {
    "foreground": "hsv(0, 0%, 20%)",
    "background": "#FFFFFF",
    "fontSize": 18,
    "isBold": true
  }
}
```

--------------------------------

### check_orientation_lock

Source: https://github.com/ronantakizawa/a11ymcp/blob/main/README.md

Detects if the provided HTML content enforces a specific screen orientation.

```APIDOC
## check_orientation_lock

### Description
Check if content forces a specific orientation.

### Parameters
#### Path Parameters
None

#### Query Parameters
None

#### Request Body
- **html** (string) - Required - HTML content to test for orientation lock issues

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

### Response
#### Success Response (200)
(See general Response Format below)

#### Response Example
(See general Response Format below)
```

--------------------------------

### Check for CSS-Level Orientation Lock

Source: https://context7.com/ronantakizawa/a11ymcp/llms.txt

This JSON payload checks for CSS-level orientation locking. The response will indicate if `hasCssOrientationLock` is true.

```json
{
  "tool": "check_orientation_lock",
  "arguments": {
    "html": "<!DOCTYPE html><html><head><style>@media screen and (orientation: landscape) { body { display: none; } }</style></head><body>Content</body></html>"
  }
}
```

--------------------------------

### Filter Rules by WCAG Tag

Source: https://github.com/ronantakizawa/a11ymcp/blob/main/README.md

Retrieve accessibility rules filtered by specific WCAG tags, such as 'wcag21aa'. This helps in focusing on relevant accessibility standards.

```json
{
  "tags": ["wcag21aa"]
}
```

--------------------------------

### check_aria_attributes

Source: https://github.com/ronantakizawa/a11ymcp/blob/main/README.md

Validates the correct usage of ARIA attributes within provided HTML content.

```APIDOC
## check_aria_attributes

### Description
Check if ARIA attributes are used correctly in HTML.

### Parameters
#### Path Parameters
None

#### Query Parameters
None

#### Request Body
- **html** (string) - Required - HTML content to test for ARIA attribute usage

### Request Example
```json
{
  "html": "<div role='button' aria-pressed='false'>Click me</div>"
}
```

### Response
#### Success Response (200)
(See general Response Format below)

#### Response Example
(See general Response Format below)
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.