Agentic Design System
Autor de guías de sistema de diseño con tokens de marca fijos y una lista de verificación de QA
Probado · Funciona
Qué hace
Crea guías de sistema de diseño listas para implementar en el estilo de marca Agentic: tokens fijos de color/tipo/espaciado, estados de componentes requeridos, criterios de aceptación WCAG 2.2 AA y una lista de verificación de QA para revisión de código. Se activa al escribir especificaciones de componentes o un lenguaje de diseño para una interfaz de usuario de producto conversacional y prioritaria en IA.
Informe de la prueba
Se ejecutó en una especificación de Button contra una línea base sin habilidad: la tabla de tokens forzada de la habilidad más su compuerta 'flag aesthetics-vs-accessibility conflicts' reveló que su propio color primario de marca #FF5701 logra solo 3.17:1 sobre blanco y falla el contraste de texto WCAG AA, un defecto que la especificación de línea base simple pasó por alto. Salida genuinamente más estructurada y comprobable; el punto débil es la descripción del frontmatter, que parece un arquetipo de UI y nunca dice 'design system', por lo que corre el riesgo de activarse incorrectamente en tareas de codificación agentic.
Probado el: 2026-07-18 · Claude Code 2.x (agent harness)
Instalación
git clone https://github.com/bergside/awesome-design-skills.git mkdir -p ~/.claude/skills cd awesome-design-skills && cp -r skills/agentic ~/.claude/skills/agentic
Comandos y prompts de ejemplo
/agenticAutor de guías de sistema de diseño con tokens de marca fijos y una lista de verificación de QA
Los skills se activan con peticiones en lenguaje natural, sin comandos que memorizar. Tras instalarlo, prompts como estos lo activan (en inglés):
I need token-based design guidelines for a primary button in our AI chat UI.Can you write component specs for a delegated-task agent interface?Help me draft a design system for my conversational AI product's UI.