Communitygithub.com

superdesigndev/superdesign

Superdesign es un agente de diseño especializado en UI/UX para frontend. Úsalo antes de implementar cualquier interfaz que requiera pensamiento de diseño.

¿Qué es superdesign?

Superdesign es un agente de diseño con inteligencia artificial especializado en la creación y modificación de interfaces de usuario (UI) y experiencia de usuario (UX) para frontend. Está diseñado para asistir a desarrolladores y diseñadores durante el proceso creativo, antes de la implementación del código. Su utilidad radica en que permite generar borradores de diseño, iterar sobre variaciones (como temas oscuros o minimalistas), extender diseños a múltiples páginas y extraer componentes reutilizables a partir de HTML. El agente se integra con archivos de contexto (--context-file) y soporta rangos de líneas, lo que facilita la reproducción fiel de componentes existentes. Superdesign es compatible con herramientas como Claude Code y Cursor, y sus comandos permiten gestionar proyectos, borradores y componentes de manera estructurada, agilizando el flujo de trabajo de diseño a código.

Compatible con~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/superdesigndev/superdesign-skill/tree/main/skills/superdesign

Preguntar en tu IA favorita

Abre un nuevo chat con esta habilidad de agente ya precargada.

Documentación

¿Qué hace superdesign?

Superdesign es un agente de diseño especializado en diseño UI/UX para frontend. Utiliza esta habilidad antes de implementar cualquier interfaz que requiera pensamiento de diseño. Comandos comunes: superdesign create-project --title "X" (configurar proyecto), superdesign create-design-draft --project-id --title "Interfaz actual" -p "Reproducir fielmente..." --context-file src/Component.tsx (reproducción fiel), superdesign iterate-design-draft --draft-id -p "tema oscuro" -p "minimalista" --mode branch --context-file src/Component.tsx (variaciones de diseño), superdesign execute-flow-pages --draft-id --pages '[...]' --context-file src/Component.tsx (extender a más páginas), superdesign create-component --project-id --name "BarraNav" --html-file /tmp/navbar.html --props '[...]' (extraer componente reutilizable), superdesign update-component --component-id --html-file /tmp/navbar.html (actualizar componente existente), superdesign list-components --project-id (listar componentes existentes). Soporta rangos de líneas: --context-file ruta:lineaInicio:lineaFin

Skills relacionados