← Volver al catálogo
Branding y diseñoAnálisisIntermedioEn el pase

Generar y Auditar Sistemas de Diseño

Genera un sistema de diseño coherente a partir de tu propio código o audita la consistencia visual de una interfaz existente. En modo generación extrae colores, tipografía, espaciado y sombras y propone tokens con documentación y vista previa HTML. En modo auditoría puntúa la UI en 10 dimensiones (consistencia de color, jerarquía tipográfica, ritmo de espaciado, modo oscuro, accesibilidad, pulido...). Ideal para arrancar un proyecto, preparar un rediseño o revisar PRs que tocan estilos.

Comprobando acceso…

Incluida en el Pase · para Claude Code, Cursor, Codex CLI

// resultado_de_ejemplo
Abrir en una pestaña nueva ↗

// qué_hace

Genera un sistema de diseño desde el código existente o audita la consistencia visual de una interfaz.

// cómo_lo_hace

En modo generación escanea CSS/Tailwind/styled-components, extrae los patrones visuales y propone tokens con DESIGN.md, JSON y vista previa HTML; en modo auditoría puntúa la UI en 10 dimensiones (0-10) con ejemplos concretos y recomendaciones de mejora.

// ejemplo_de_uso

Úsala cuando tu web tiene colores y espaciados a ojo y quieres unificarlos en tokens, o medir cómo de coherente es ya. Ej.: escanea tu CSS y Tailwind, saca 9 grises distintos para lo mismo y los reduce a una paleta de tokens; en modo auditoría puntúa tu UI 6,5/10 con ejemplos a corregir.

// plataformas

Claude CodeCursorCodex CLI
Categoría
Branding y diseño
Tipo
Análisis
Nivel
Intermedio
Licencia
MIT
Seguridad
seguro · riesgo bajo
Versión
1.0.0

// opiniones_de_la_comunidad

Opiniones

Cargando opiniones…