Skip to main content
Glama
deenesjakoruzh

A11y MCP Server

by ronantakizawa
npmGitHub
JavaScript
MIT License
17
9
  • Linux
  • Apple
OverviewInspectNewSchemaRelated ServersReviewsScore
Need Help?View Source CodeReport Issue

Web アクセシビリティ テスト MCP サーバー (A11y MCP)

a11ymcpwide

A11y MCP は、LLM に Web アクセシビリティ テスト API へのアクセスを提供する MCP (モデル コンテキスト プロトコル) サーバーです。

このサーバーは、Deque Axe-core API と Puppeteer を使用して、LLM が Web コンテンツの WCAG 準拠を分析し、アクセシビリティの問題を特定できるようにします。

注意: これは Deque Labs の公式 MCP サーバーではありません。

プロジェクトを楽しんだら星を付けてください！🌟

特徴

  • ウェブページのテスト: 公開 URL のアクセシビリティ問題をテストします
  • HTML スニペットのテスト: 生の HTML 文字列のアクセシビリティ問題をテストします
  • WCAG コンプライアンステスト: さまざまな WCAG 標準 (2.0、2.1、2.2) に照らしてコンテンツをチェックします。
  • カスタマイズ可能なテスト: テストするアクセシビリティタグ/標準を指定します
  • ルール探索: 利用可能なアクセシビリティルールに関する情報を取得する
  • 色コントラスト分析: WCAG準拠の色の組み合わせをチェック
  • ARIA 検証: ARIA 属性の適切な使用をテストする
  • 画面の向きのロック検出: 特定の画面の向きを強制するコンテンツを識別します

インストール

このサーバーを Claude Desktop で使用するには、MCP 設定で構成する必要があります。

macOSの場合: '~/Library/Application Support/Claude/claude_desktop_config.json'にあるファイルを編集します。

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

Windowsの場合: %APPDATA%\Claude\settings\claude_mcp_settings.jsonにあるファイルを編集します。

Linux の場合: ~/.config/Claude/settings/claude_mcp_settings.jsonにあるファイルを編集します/path/to/axe-mcp-server/build/index.jsコンパイルされたサーバー ファイルへの実際のパスに置き換えます。

利用可能なツール

アクセシビリティテスト

URL のアクセシビリティ問題をテストします。

���ラメータ:

  • url (必須): テストするウェブページのURL
  • tags (オプション): テストするWCAGタグの配列 (例: ["wcag2aa"])

例

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

テストHTML文字列

HTML 文字列のアクセシビリティ問題をテストします。パラメータ:

  • html (必須): テストするHTMLコンテンツ
  • tags (オプション): テストするWCAGタグの配列 (例: ["wcag2aa"])

例

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

ルールを取得する

オプションのフィルタリングを使用して、利用可能なアクセシビリティ ルールに関する情報を取得します。

色のコントラストをチェックする

前景色と背景色の組み合わせが WCAG コントラスト要件を満たしているかどうかを確認します。

パラメータ:

  • foreground （必須）: 16進形式の前景色（例："#000000"）
  • background （必須）: 16進形式の背景色（例："#FFFFFF"）
  • fontSize (オプション): ピクセル単位のフォントサイズ (デフォルト: 16)
  • isBold (オプション): テキストが太字かどうか (デフォルト: false)

例

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

色のコントラストをチェックする

HTML で ARIA 属性が正しく使用されているかどうかを確認します。

パラメータ:

  • html (必須): ARIA 属性の使用をテストする HTML コンテンツ

例

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

チェック方向ロック

コンテンツが特定の方向を強制するかどうかを確認します。

パラメータ:

  • html (必須): 方向ロックの問題をテストするための HTML コンテンツ

例

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

応答フォーマット

サーバーは、アクセシビリティ テストの結果を構造化された 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" }, "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" } }

依存関係

  • @モデルコンテキストプロトコル/sdk
  • 操り人形師
  • @axe-core/操り人形師
  • 斧の芯
Install Server
A
security – no known vulnerabilities
A
license - permissive license
A
quality - confirmed to work

How are these scores calculated?

hybrid server

The server is able to function both locally and remotely, depending on the configuration or use case.

Tools

LLM が Deque Axe-core API と Puppeteer を使用して WCAG 標準に対する Web アクセシビリティ テストを実行できるようにする MCP サーバー。

  1. 特徴
    1. インストール
      1. 利用可能なツール
        1. アクセシビリティテスト
        2. テストHTML文字列
        3. ルールを取得する
        4. 色のコントラストをチェックする
        5. 色のコントラストをチェックする
        6. チェック方向ロック
      2. 応答フォーマット
        1. 依存関係

          Related MCP Servers

          • MCP Accessibility Scanner

            JustasMonkev
            A
            security
            A
            license
            A
            quality
            Enables automated web accessibility scans for WCAG compliance using Playwright and Axe-core, providing visual and JSON reports with remediation guidance.
            Last updated -
            1
            43
            7
            TypeScript
            MIT License

          • Web Accessibility MCP Server

            bilhasry-deriv
            A
            security
            A
            license
            A
            quality
            Provides web accessibility analysis and color blindness simulation using axe-core and Puppeteer, enabling detailed accessibility checks and visual simulations based on WCAG guidelines.
            Last updated -
            2
            1
            JavaScript
            MIT License
            • Apple
            • Linux

          • Cursor A11y MCP

            westsideori
            A
            security
            A
            license
            A
            quality
            Provides accessibility testing capabilities through CLI, helping identify accessibility issues in web applications using axe-core and Puppeteer.
            Last updated -
            1
            JavaScript
            MIT License

          • a11y-mcp

            priyankark
            -
            security
            -
            license
            -
            quality
            An MCP (Model Context Protocol) server for performing accessibility audits on webpages using axe-core. Use the results in an agentic loop with your favorite AI assistants (Cline/Cursor/GH Copilot) and let them fix a11y issues for you!
            Last updated -
            JavaScript
            Mozilla Public License 2.0

          View all related MCP servers

          Appeared in Searches

          New MCP Servers

          MCP directory API

          We provide all the information about MCP servers via our MCP API.

          curl -X GET 'https://glama.ai/api/mcp/v1/servers/ronantakizawa/a11ymcp'

          If you have feedback or need assistance with the MCP directory API, please join our Discord server