Ir a la guía de uso
accessibility-reviewpor Anthropic

Accessibility Review Skill.

Una skill de Claude Code y Codex para revisión de diseño: auditoría WCAG 2.1 AA de un diseño o página: contraste, teclado, objetivos táctiles.

  • Revisión de Diseño y Accesibilidad
  • Informe de revisión
anthropics/knowledge-work-plugins · design/skills/accessibility-review/SKILL.mdSKILL.md
--- name: accessibility-review description: Run a WCAG 2.1 AA accessibility audit on a design or page. Trigger with "audit accessibility", "check a11y", "is this accessible?", or when reviewing a design for color contrast, keyboard navigation, touch target size, or screen reader behavior before handoff. --- ## Usage ## Testing Approach ## Output ## Accessibility Audit: [Design/Page Name] ## If Connectors Available ## Tips
Encabezado y títulos de sección leídos del archivo original el 14/09/2026 · 4.248 caracteres completos

01 Qué hace

Qué hace el Skill accessibility-review en Claude Code y Codex

Resumen, flujo de trabajo y resultados, todo leído del SKILL.md del skill.

Del SKILL.mdLeído 2026-09-14 · no es una ejecución registrada

En los propios términos del Skill

Una rutina de auditoría WCAG 2.1 AA para un diseño o una página, que se activa con frases como «auditar la accesibilidad» o «comprobar a11y» y que toma una URL de Figma, una URL o una descripción como argumento.

Incluye una referencia rápida condensada de once criterios repartidos entre Perceptible, Operable, Comprensible y Robusto, que abarca contraste de 4,5:1 para texto normal, 3:1 para texto grande y componentes de la interfaz, acceso por teclado, foco visible y objetivos táctiles de 44x44 píxeles CSS, además de ocho problemas habituales y un enfoque de pruebas en cinco pasos que comienza con un escaneo automatizado que detecta aproximadamente el 30 % de los problemas. Los hallazgos se plasman en un informe markdown de estructura fija con recuentos por gravedad, tablas por principio, secciones de contraste, teclado y lector de pantalla, y correcciones priorizadas.

Qué produce

  • Un informe de auditoría de accesibilidad en markdown encabezado con el nombre del diseño o de la página y el estándar WCAG 2.1 AA.
  • Una sección de hallazgos dividida en tablas de Perceptible, Operable, Comprensible y Robusto con problema, criterio, gravedad y recomendación.
  • Tablas específicas de contraste de color, navegación por teclado y lector de pantalla, incluido el nombre anunciado de cada elemento.
  • Una lista ordenada de correcciones prioritarias que separa las críticas, que bloquean a los usuarios, de las mejoras importantes y los detalles secundarios.
Ver el ejemplo de prompt ↗

Cómo funciona

  1. 01
    Introduzca el elemento que va a auditar

    El comando toma una URL de Figma, la URL de una página o una descripción escrita como argumento y audita ese objetivo.

  2. 02
    Compruebe los once criterios AA

    La referencia rápida agrupa los criterios en Perceptible, Operable, Comprensible y Robusto, cada uno con el número de su criterio de conformidad y su umbral.

  3. 03
    Realice las cinco pasadas de prueba

    Escaneo automatizado, navegación solo con teclado, pruebas con lector de pantalla, verificación de contraste y zoom al 200 %, en ese orden.

  4. 04
    Escriba la estructura fija del informe

    Un único informe markdown con un resumen de gravedad, una tabla de hallazgos por principio y tablas independientes de contraste, teclado y lector de pantalla.

  5. 05
    Use los conectores cuando estén disponibles

    Con una herramienta de diseño conectada, lee los valores de color, los tamaños de fuente y los objetivos táctiles de Figma; con un gestor de proyectos, abre un ticket por cada hallazgo.

02 Encuentra tu caso de uso

Cuándo usar la Skill accessibility-review

Usa el skill accessibility-review en Claude Code o Codex cuando el trabajo sea revisión de diseño de este tipo. Alcance y límites a continuación están tomados del archivo propio del skill.

Buen caso de uso

  • Revisar un diseño en busca de contraste de color, navegación por teclado, tamaño de los objetivos táctiles o comportamiento del lector de pantalla antes de la entrega.
  • Auditar una página ya terminada, siempre que puedas darle una URL.
  • Leer los valores de color, los tamaños de fuente y los objetivos táctiles directamente de un archivo de Figma cuando hay una herramienta de diseño conectada.
  • Convertir la auditoría en trabajo con seguimiento creando un ticket por hallazgo y vinculándolos a las epics de remediación existentes.

Conozca los límites

  • Dar por hecho que la auditoría cubre todo: el análisis automatizado pasa por alto la mayoría de los problemas y sigue siendo necesario probar con tecnología de asistencia real.

Qué proporcionar

  • La propia referencia de diseño o de páginaSe sustituye en la instrucción de auditoría como primer argumento.

03 Dentro del skill

Reglas que el skill accessibility-review aporta a Claude Code y Codex

7 instrucciones concretas, valores predeterminados y límites que el SKILL.md establece para el agente: la parte del archivo que cambia el resultado.

  1. Exigir 3:1 a los componentes de UI

    El contraste no textual de al menos 3:1 es obligatorio para los componentes de UI y los gráficos según el criterio 1.4.11.

  2. Exigir objetivos táctiles de 44x44

    Los objetivos táctiles deben medir al menos 44x44 píxeles CSS, según el criterio 2.5.5.

  3. Hacer que todo sea alcanzable con el teclado

    Toda la funcionalidad debe estar disponible mediante el teclado (2.1.1) con un indicador de foco visible (2.4.7).

  4. El zoom al 200% como aprobado o suspenso

    La maquetación se prueba con el zoom al 200% y se marca si se rompe.

  5. Vincular cada hallazgo a un criterio

    Cada fila de las tablas de hallazgos indica el criterio WCAG junto con el problema, la severidad y la recomendación.

  6. Clasificar la severidad como crítica, mayor o menor

    Los hallazgos se etiquetan con una de las tres severidades, mostradas como marcadores de color en la columna de recomendación.

  7. Empezar por el contraste y el teclado

    El skill prioriza el contraste y el teclado porque son los que detectan los problemas más comunes y de mayor impacto.

04 Ponlo a trabajar

Instalar accessibility-review en Claude Code o Codex

Un comando npx skills add, luego una primera tarea en tu agente y una lista de verificación para el resultado.

Añadir accessibility-review a Claude Code, Codex o tu agente

Ejecútelo en su proyecto; el instalador pregunta a qué agente añadirlo.

Terminal
npx skills add https://github.com/anthropics/knowledge-work-plugins --skill accessibility-review

Forma genérica del CLI skills para design/skills/accessibility-review/SKILL.md; el repositorio puede documentar su propia ruta.

Dale al skill una primera tarea de revisión de diseño

Redactado en los términos del propio skill; sustituya las partes entre corchetes por su material.

Starter prompt
Audit accessibility for [Figma URL for the checkout flow] before we hand it to engineering. Start with contrast and keyboard access, and flag anything that would block a screen reader user as critical.

Fuente: redactado a partir del SKILL.md en los términos del propio skill.

Revisa el primer resultado

Lo que el propio SKILL.md indica que debe ser un resultado correcto:

  • Recorra todo solo con el teclado.
  • Pruebe con VoiceOver o NVDA en lugar de confiar en la auditoría.
  • Verifique los ratios de contraste reales frente a los valores exigidos.
  • Trabaje las correcciones prioritarias en orden: primero los problemas bloqueantes y después el pulido.

En OpenDesign importe accessibility-review desde su enlace SKILL.md: Plugins → Add → Skill → Import from link, y luego selecciónelo en la barra superior.

05 Código abierto, rastreable

Fuente, Licencia y Verificación

De dónde provienen los datos de esta página y cuándo se verificaron por última vez.

Author
Anthropic
Archivo de skill
design/skills/accessibility-review/SKILL.md Suma de verificación de contenido registrada en la verificación; commit 8f877b6
License
Apache-2.0 De LICENSE.
Estrellas del repositorio
24.012 Instantánea de GitHub tomada el 14/09/2026 para todo el repositorio anthropics/knowledge-work-plugins, que contiene 7 skills en este catálogo. No es una valoración ni un recuento de uso para accessibility-review.
Verificado por OpenDesign
14/09/2026 Se verificaron el archivo fuente, la ruta, el texto de licencia y el recuento de estrellas. No incluido en OpenDesign principal (verificado el 28/08/2026); no se ha registrado una ejecución en vivo en esta página.

Dentro del SKILL.md

  1. UsoMuestra la forma del comando y cómo se sustituye el argumento en la auditoría.
  2. Referencia rápida de WCAG 2.1 AAOnce criterios enumerados bajo Perceptible, Operable, Comprensible y Robusto, con sus umbrales.
  3. Problemas frecuentesOcho fallos recurrentes, desde el contraste y las etiquetas de formulario hasta las trampas de foco y los límites de tiempo.
  4. Enfoque de pruebasCinco pasadas: escaneo automatizado, teclado, lector de pantalla, contraste y zoom al 200 %.
  5. SalidaLa plantilla de informe con el resumen de severidad, las tablas por principio, las filas de contraste y las correcciones prioritarias.
  6. Si hay conectores disponiblesQué cambia al conectar una herramienta de diseño o un gestor de proyectos.
  7. ConsejosEmpiece por el contraste y el teclado, pruebe con tecnología de asistencia real y priorice según el impacto.
La descripción propia del Skill
«Ejecuta una auditoría de accesibilidad WCAG 2.1 AA en un diseño o página. Actívalo con "auditar accesibilidad", "revisar a11y", "¿esto es accesible?" o al revisar un diseño para contraste de color, navegación por teclado, tamaño de zonas táctiles o comportamiento de lector de pantalla antes de la entrega.»

Descripción del front-matter de SKILL.md. El archivo completo tiene aproximadamente 4.248 caracteres. Lee el archivo completo en GitHub.

Accessibility Review

Ejecutar accessibility-review en una tarea real de revisión de diseño.

Descarga OpenDesign, importa accessibility-review desde su enlace SKILL.md, pega el prompt de arriba y lee el plan antes del resultado.

Terminal
npx skills add https://github.com/anthropics/knowledge-work-plugins --skill accessibility-review

OpenDesign Desktop

Un sistema de diseño. Tu marca, coherente en cada resultado

En el Vibe Design Workspace completo, aplica las mismas reglas de marca a sitios web, presentaciones, prototipos interactivos, dashboards, imágenes y vídeo HTML. Conecta Codex, Claude Code, Cursor y otros agentes de código locales y crea gratis.

  • Web, presentaciones, prototipos, dashboards, imágenes y vídeo
  • Más de 140 sistemas de diseño y la biblioteca completa de plantillas y skills
  • Codex local y más de 21 agentes de código · Gratis
Descargar gratis

Disponible para macOS y Windows