Accessibility Design System

About

Audita el sistema de diseño de la pestaña activa y exporta un reporte HTML con colores, tipografía, componentes y tokens.

Descripción
Accessibility Design System analiza el sistema de diseño del sitio abierto en la pestaña activa y genera un reporte HTML autoconclusivo para revisar su consistencia visual y estructural.

La extensión inspecciona la interfaz de la página actual para identificar colores, tipografías, espaciados, patrones de layout, componentes reutilizables, variables CSS, tokens de diseño e inconsistencias entre estilos. El resultado se muestra en un panel lateral y también puede exportarse como un archivo HTML para documentación, revisión interna o auditoría.

Funciones principales:

Análisis del DOM visible de la página activa.
Detección de colores y clasificación visual.
Extracción de tipografías, tamaños, pesos e interlineados.
Revisión de spacing, max-widths, flex, grid y breakpoints.
Detección heurística de componentes de interfaz.
Lectura de variables CSS y reglas de estilos relevantes.
Generación de tokens de diseño sugeridos.
Detección de inconsistencias visuales.
Exportación de un reporte HTML autónomo.
Soporte para shadow DOM abierto cuando está disponible.