A11y Audit

Auditoría WCAG 2.2 AA/AAA con relaciones de contraste medidas y correcciones referenciadas por criterios

Por plugin87 · plugin87/ux-ui-agent-skills

Probado · Funciona ★ 8.4/10

A11y Audit — Auditoría WCAG 2.2 AA/AAA con relaciones de contraste medidas y correcciones referenciadas por criterios

Qué hace

Audita una UI o componente contra WCAG 2.2 AA/AAA y patrones WAI-ARIA, devolviendo una tabla de hallazgos clave para criterios de éxito específicos con severidad P0/P1/P2 y correcciones concretas. Se activa cuando el usuario solicita una verificación de accesibilidad, verificación de contraste o revisión de teclado/lector de pantalla. Lee una lista de verificación organizada por POUR y una referencia ARIA y mide el contraste de color con un script incluido en lugar de estimar las relaciones a ojo.

Informe de la prueba

SKILL.md obtenido y se verificaron 6 rutas referenciadas vía raw fetch — todas HTTP 200; wcag-checklist.md y aria-patterns.md son referencias reales sustanciales (tabla de criterios organizada por POUR, mapas de teclado ARIA APG). Se ejecutó scripts/contrast.py (pure python3, sin dependencias): #767676/#fff = 4.54:1 PASS, #999/#fff = 2.85:1 FAIL, códigos de salida correctos. Para la prueba de salida, escribí un card.html de 6 elementos y lo audité de dos maneras: una auditoría visual de línea base vs el cuerpo de la habilidad, que exige ejecutar contrast.py por par. Las relaciones medidas invirtieron dos juicios visuales — el enlace azul #5b8def parece bien pero mide 3.23:1 (FAIL 1.4.3) y la insignia roja #d32f2f parece débil pero mide 4.98:1 (PASS); el encabezado #8a8a8a = 3.45:1 y el texto #a0a0a0 = 2.61:1 ambos FAIL. Sin problemas de seguridad (sin curl|sh, base64, eval). Fricción: el directorio de la habilidad solo incluye SKILL.md y depende de archivos/scripts hermanos en la raíz del repositorio, por lo que una copia independiente del directorio de la habilidad rompe sus pasos — se necesita una instalación completa del paquete.

Probado el: 2026-07-21 · Claude Code 2.x (agent harness)

Instalación

git clone --depth 1 https://github.com/plugin87/ux-ui-agent-skills.git /tmp/a11y-audit-src
mkdir -p ~/.claude/skills
cp -R /tmp/a11y-audit-src/.claude/skills/a11y-audit ~/.claude/skills/a11y-audit
# IMPORTANT: the skill dir holds only SKILL.md. Its steps read repo-root sibling files
#   accessibility/wcag-checklist.md, accessibility/aria-patterns.md, taste/motion-choreography.md
#   and run scripts/contrast.py, scripts/measure_render.mjs, scripts/verify_states.mjs
# — all relative to the repo root, NOT bundled with the skill. For full function, install the
# whole package into your project: npx ux-ui-agent-skills  (installs accessibility/ + scripts/ too).
# scripts/contrast.py = pure python3, no deps. measure_render.mjs/verify_states.mjs need:
#   npm i -D playwright   (without it they SKIP with exit 0, they do not error).

Comandos y prompts de ejemplo

/a11y-auditAuditoría WCAG 2.2 AA/AAA con relaciones de contraste medidas y correcciones referenciadas por criterios

Los skills se activan con peticiones en lenguaje natural, sin comandos que memorizar. Tras instalarlo, prompts como estos lo activan (en inglés):

Audit this page for WCAG 2.2 AA compliance
Check the contrast ratios on this design
Review this component for screen-reader support

Informe completo →