Download PDFMarkdown Version
ClaudeChatGPTPerplexityGeminiMicrosoft CopilotRaycastMeta AIGrokZ.aiQwenKimi
DeepSeekMistralCursorVS CodeWindsurfJetBrainsClineLovableVercel AI SDKLangChain

Use WCAG 2.2 with your AI.

Connect your account once and let the AI you already use work with it, without building another integration. Guarantee WCAG 2.2 AA standards before a single line of code ships.

Included with plan

Ask AI about this Connector

Developed, maintained, and hosted by Vinkius.

MCP VERIFIED · PRODUCTION READY · VINKIUS GUARANTEED

Waiting for input…

Works with modern AI clients that support MCP, including ChatGPT, Claude, Cursor, and more.

ChatGPTClaudeCursorPerplexityGeminiMicrosoft CopilotRaycastMeta AI

Complete set · 1 capability

The complete WCAG 2.2 capability set.

These are the exact actions your AI can choose when you ask it to work with WCAG 2.2.

Capability set01 / 01

01

1 capability in this set.

Part of 1 available through WCAG 2.2.

  1. 01

    Validate accessibility

    You must: (1) map LANDMARKS using semantic HTML5 elements. <header>, <nav>, <main>, <article>, <section>, <aside>, <footer>. Never use <div> with click handlers in place of <button>. Never use <a> for actions that do not navigate, (2) specify KEYBOARD navigation. tab order (tabindex="0" for custom elements), focus-visible indicators (ban outline:none), modal focus traps (inert on background), roving tabindex for composite widgets, (3) cite NUMERICAL contrast ratios. 4.5:1 minimum for normal text (<18pt/24px), 3:1 minimum for large text (≥18pt/24px or ≥14pt bold). Include hover/focus state ratios, (4) define SCREEN READER context. descriptive alt texts (not "image of"), aria-label on icon-only buttons, explicit <label for="id"> on form inputs, aria-describedby for validation, aria-live for dynamic content, (5) define MOTION safety. prefers-reduced-motion CSS overrides for all transitions and animations, pause controls on auto-playing media, no content-conveying-only-through-motion. If the capability rejects, your UI design contains accessibility barriers. fix them before building. Structured reflection capability for accessibility compliance (WCAG 2.2 AA / EAA 2025 / Section 508). Forces the agent to validate semantic HTML landmarks, keyboard navigation specs, text/background contrast ratios, screen reader ARIA annotations, and motion media queries BEFORE building a component. Catches Div Soup (no semantic landmarks), Keyboard Traps (unreachable interactive elements), Contrast Failures (ratios below 4.5:1), Screen Reader Blindness (missing alt/aria-label/form associations), and Motion Hostility (no prefers-reduced-motion). Call once per UI view or complex component

Observed, not estimated

818ms average. Fast in production.

WCAG 2.2 is checked daily against the live service.

Daily averagePeak 972ms
Aug 20Today
Fastest day
679ms
Slowest day
972ms
14-day trend
Stable+1%

Connect your client

One URL. Every client.

Activate the Connector, copy your link, and paste it into the client you already use. 1 capability arrives ready to run.

Preview access · not provider authentication

The vk_preview_* token belongs to Vinkius preview infrastructure. It lets Claude discover and display the capabilities of WCAG 2.2, so you can see the experience inside your AI.

It does not authenticate your account with WCAG 2.2. Actions requiring credentials or live account data may not run until you activate the Connector and authorize the service.

WCAG 2.2 Connector

You're all set. Choose your MCP client and follow the setup instructions.

Connector linkhttps://edge.vinkius.com/vk_preview_Z4jgihFSGVmVid2ldA4mxeRfY0ki8hZy1vHx94N4/mcp

Claude Desktop

Follow the steps below to connect in seconds.

  1. 1In Claude Desktop, open Settings → Connectors.
  2. 2Click “Add custom connector” and paste the connector link above as the remote MCP server URL.
  3. 3Click Add and start a new chat — WCAG 2.2 capabilities are ready to use.
Configuration · claude_desktop_config.jsonCopy
{
  "mcpServers": {
    "accessibility-prover-mcp": {
      "url": "https://edge.vinkius.com/vk_preview_Z4jgihFSGVmVid2ldA4mxeRfY0ki8hZy1vHx94N4/mcp"
    }
  }
}
  • Claude
  • ChatGPT
  • Cursor
  • VS Code
  • Windsurf
  • Claude Code
  • JetBrains
  • Cline

Step-by-step instructions for each client are in the guide. How to connect

FAQ

Questions WCAG 2.2 owners ask.

  • 01

    Why does Accessibility Prover reject divs with click handlers?

    A ` has no native keyboard interactivity, no focusability, and no implicit ARIA role. Adding onclick creates a visual button that keyboard and screen reader users cannot operate. Native ` elements provide focus, Enter/Space activation, and the 'button' role automatically. no extra JavaScript required.

  • 02

    What is a focus trap and when is it required?

    A focus trap constrains Tab navigation inside a specific element. typically a modal, dialog, or dropdown. so users cannot navigate to the underlying page while the overlay is active. WCAG 2.4.3 (Focus Order) requires it for all modal dialogs. Without it, a keyboard user can Tab behind the modal into invisible content.

  • 03

    Does Accessibility Prover check contrast across all interactive states?

    Yes. The contrastCompliant pivot validates foreground/background color combinations across five states: default, hover, focus, active, and disabled. A button that passes contrast in its default state but fails on hover (e.g., light gray text on white) is flagged as CONTRAST_FAILING.

  • 04

    How is this different from axe-core or Lighthouse?

    axe-core and Lighthouse scan rendered HTML in a browser. they detect violations after the code is built and running. Accessibility Prover validates UI specifications before code is written. It reasons about component behavior, keyboard flows, and interaction states at the design level, catching architectural issues that post-build scanners cannot see because they only inspect the final DOM.

  • 05

    Can I use Accessibility Prover with an AI coding agent?

    Yes. that is a primary use case. AI coding agents default to div-based layouts because divs are syntactically simpler. Accessibility Prover acts as a guardrail: the agent submits its component specification, the prover validates it against 5 pivots, and the agent receives a structured verdict with specific fixes before writing code.

  • 06

    What does the European Accessibility Act (EAA 2025) mean for my product?

    Since June 2025, the EAA requires all digital products and services sold in the EU to meet accessibility standards equivalent to WCAG 2.1 AA (with WCAG 2.2 AA as the recommended benchmark). Non-compliance carries fines up to 5% of annual revenue and potential market withdrawal. Accessibility Prover helps demonstrate compliance as a build-time gate, creating an auditable validation record.

  • 07

    What input format does Accessibility Prover expect?

    Submit each component as structured text covering 5 dimensions: (1) Layout. the HTML elements and hierarchy, (2) Keyboard. tab order, focus indicators, focus traps, (3) Contrast. foreground and background hex values with computed ratio, (4) Screen Reader. alt texts, aria-labels, form-label associations, (5) Motion. animation properties and prefers-reduced-motion handling. The capability reasons about each dimension independently.

  • 08

    Does Accessibility Prover support WCAG 2.2 AAA?

    The capability validates against WCAG 2.2 AA, which is the legally required level under the EAA 2025 and the practical target for most products. AAA requirements (e.g., 7:1 contrast ratio, sign language interpretation) are not enforced. they are aspirational goals that few products achieve fully.

Explore

More in Productivity

Suggestions