A11y Feedback MCP

Proporciona a los agentes de código y diseño un bucle de retroalimentación de accesibilidad real, en lugar de otro recordatorio de «seguir las WCAG».

a11y-feedback-mcp renderiza una interfaz en Chromium, ejecuta axe-core y devuelve evidencia procesable a cualquier cliente del Model Context Protocol: reglas incumplidas, impacto, selectores CSS, fragmentos del DOM, estilos calculados, cajas delimitadoras, pasos de corrección y candidatos de contraste que superan matemáticamente la comprobación.

Funciona directamente con Codex y Claude Code. Para Claude Design, el flujo de trabajo fiable es conectar Claude Code tanto al servidor MCP de Claude Design como a este servidor, luego auditar el HTML generado o la vista previa en vivo y enviar las correcciones de vuelta a través del flujo de trabajo de diseño.

Esto es una ayuda automatizada de pruebas, no un servicio de certificación WCAG. Informa deliberadamente de comprobaciones incompletas y requiere pruebas humanas para teclado, foco, lectores de pantalla, zoom, movimiento, cognición y calidad del contenido.

Qué significa «retroalimentación en vivo»

flowchart TD
    A["Agent creates or changes UI"] --> B["Render at target viewport"]
    B --> C["Run axe + contrast analysis"]
    C --> D["Return evidence and correction"]
    D --> E["Agent proposes or applies code fix"]
    E --> F["Re-run same audit"]
    F --> G["Human checks incomplete behavior"]

El servidor es de solo lectura. Nunca edita un proyecto silenciosamente. El agente conectado utiliza la evidencia para realizar un cambio acotado y luego vuelve a ejecutar la auditoría para verificarlo.

Related MCP server: Accessibility MCP Server

Herramientas

Todas las herramientas están anotadas como de solo lectura. El servidor también expone un prompt accessibility-fix-loop.

Perfiles de estándares

Las herramientas de auditoría admiten wcag2a, wcag2aa, wcag2aaa, wcag21aa, wcag21aaa, wcag22aa, wcag22aaa y best-practice. Los perfiles AA incluyen todos los criterios A y AA requeridos; los perfiles AAA incluyen A, AA y AAA. wcag22aa sigue siendo el predeterminado porque el W3C recomienda la última versión de WCAG y advierte contra la exigencia de AAA en todo el sitio como política general. Use AAA como objetivo mejorado explícito e informe el progreso a nivel de criterio.

Una asignación de axe significa cobertura automatizada parcial, nunca que se haya probado el criterio de éxito completo. get_wcag_checklist expone los 55 criterios requeridos para WCAG 2.2 AA o los 86 requeridos para WCAG 2.2 AAA, incluido el trabajo manual que la automatización no puede completar.

Requisitos

• Node.js 20 o superior

• Chrome o Edge recomendados

• Windows, macOS o Linux

El servidor busca Chrome/Edge instalados primero. En entornos Linux compatibles puede recurrir a @sparticuz/chromium incluido. Puede configurar A11Y_MCP_BROWSER_PATH con la ruta a un ejecutable de navegador explícito. El sandboxing de Chromium permanece habilitado por defecto; establezca A11Y_MCP_NO_SANDBOX=true solo para contenedores restringidos o entornos de ejecución estilo Lambda que no puedan lanzar Chrome de otra manera.

Instalación en Windows

Abra PowerShell en la carpeta donde guarda sus proyectos:

git clone https://github.com/aditya-ariosity/a11y-feedback-mcp.git
cd a11y-feedback-mcp
npm install
npm run build

Si el repositorio aún no está en GitHub, descargue o copie esta carpeta primero y luego ejecute los tres últimos comandos dentro de ella.

Conectar Codex

Desde PowerShell, use la ruta absoluta al punto de entrada compilado:

codex mcp add a11y-feedback -- node "C:\full\path\to\a11y-feedback-mcp\dist\index.js"

O añada la configuración equivalente a ~/.codex/config.toml:

[mcp_servers.a11y_feedback]
command = "node"
args = ["C:\\full\\path\\to\\a11y-feedback-mcp\\dist\\index.js"]
startup_timeout_sec = 30
tool_timeout_sec = 90

[mcp_servers.a11y_feedback.env]
A11Y_MCP_ALLOWED_ROOT = "C:\\full\\path\\to\\your-projects"

Reinicie Codex y luego pregunte:

Audite esta página a 1440×900 y 390×844. Corrija los problemas críticos y graves, vuelva a ejecutar ambas auditorías y liste las comprobaciones manuales restantes.

Consulte docs/codex.md para verificación y solución de problemas.

Conectar Claude Code

claude mcp add --scope user a11y-feedback -- node "C:\full\path\to\a11y-feedback-mcp\dist\index.js"

Ejecute claude mcp list para confirmar la conexión. Consulte docs/claude-code-and-design.md para el flujo de trabajo de puente de Claude Design.

Desarrollo

npm install
npm run check
npm test
npm run test:e2e
npm run build

npm test cubre matemáticas de color, protección de red, corrección y el contrato MCP. npm run test:e2e lanza Chromium y audita el fixture intencionalmente inaccesible.

Inicie el servidor stdio local:

npm run dev

Inicie el transporte HTTP Streamable opcional:

npm run build
npm run start:http

El endpoint es http://127.0.0.1:3000/mcp; el endpoint de salud es http://127.0.0.1:3000/health. HTTP se vincula a 127.0.0.1 por defecto.

Variables de entorno

No exponga el servidor HTTP de referencia directamente a Internet público. Coloque autenticación, TLS, límites de velocidad, límites de tamaño de solicitud y aislamiento de inquilinos delante de él. Lea docs/security.md.

Alcance actual

El MVP cubre interfaces web renderizadas y cálculos deterministas de contraste. Aún no inspecciona aplicaciones móviles nativas, PDFs, lienzos, subtítulos de video ni píxeles sin procesar de Claude Design. Los adaptadores planificados pueden añadir parches que tienen en cuenta el framework, asistencia de capturas/OCR, integración de tokens de diseño, anotaciones de CI y conectores de lienzo de diseño de primera clase sin cambiar el contrato MCP.

Documentos del proyecto

• Arquitectura y especificación del producto

• Configuración de Codex

• Configuración de Claude Code y Claude Design

• Modelo de seguridad

• Modelo de cobertura W3C WAI

• Habilidad del agente complementario

• Contribuir

Licencia

MIT