Una skill para agentes de IA que ofrece a los asistentes de programación reglas de diseño UI/UX, estilos, paletas, combinaciones tipográficas y recomendaciones específicas para cada stack.
Programación con IA
Skills de diseño de interfaces para agentes de programación: 29 proyectos open source (2026)
Dales criterio de diseño a Claude Code, Codex y Cursor: skills y herramientas para interfaces más limpias y menos genéricas.
- Proyecto
- 29
- Esta semana
- +21,5 mil
- Actualizado
- hace 4 horas
Cómo elegir
Decide primero qué necesitas: evitar interfaces genéricas del agente, tener un espacio de diseño completo o copiar el estilo de algo existente. Nutlope/hallmark es una skill para lograr una UI que no parezca generada por IA. nexu-io/open-design es un espacio local que convierte briefs en prototipos, presentaciones e imágenes. amaancoderx/npxskillui extrae el sistema de diseño de un sitio o código existente en archivos que Claude Code puede leer.
- hallmarkIdeal para quien quiere que Claude Code, Cursor o Codex generen una UI que no parezca hecha por IA, con una sola skill.
- open-designIdeal para quien quiere un espacio local y de código abierto donde su propio agente convierta briefs en prototipos, presentaciones e imágenes, en lugar de Figma.
- npxskilluiIdeal para quien necesita que Claude Code construya una UI acorde al sistema de diseño de un sitio, repositorio o código local existente.
Comparación de los principales proyectos
| Proyecto | Estrellas | Esta semana | Licencia | Actualizado |
|---|---|---|---|---|
| 146,5 mil | +3,1 mil | MIT | hace 6 horas | |
| 111,6 mil | +4,7 mil | MIT | hace 9 horas | |
| 106,5 mil | +1,3 mil | Apache-2.0 | hace 4 horas | |
| 50,1 mil | +6,4 mil | MIT | anteayer | |
| 28,9 mil | +639 | MIT | hace 4 días | |
| 14,8 mil | +1,7 mil | MIT | hace 6 días |
Todos los proyectos
Ordenar:Más estrellas
Agent Skills para que los agentes de programación diseñen interfaces distintivas, con dirección de arte, fotos reales y una revisión en el navegador, en lugar de páginas genéricas de IA.
Espacio de trabajo local y de código abierto para agentes de diseño con IA que convierte briefs en prototipos, presentaciones, dashboards, imágenes y videos con tu propio agente de programación.
Un skill de diseño para Claude Code, Cursor y Codex que guía a los agentes de programación con IA para crear interfaces que no parezcan generadas por IA.
Una skill de diseño nativa de HTML para agentes de programación con IA que convierte una instrucción de texto en prototipos, presentaciones, animaciones e infografías.
Colección de archivos de habilidades de diseño independientes para herramientas de programación con IA como Claude Code, Cursor y Codex; comienza con una habilidad para páginas de destino.
Colección seleccionada de seis Skills para Claude Code, Cursor, Codex y agentes de programación con IA similares, sobre diseño web, video, imágenes, artículos y recuperación de conocimiento local.
Reglas y skills para que un agente de programación con IA evite interfaces genéricas, textos de marketing y comentarios con estilo de IA.
Un skill de agente que ejecuta Claude Design localmente en Cursor, Claude Code u otros agentes para crear maquetas, prototipos y presentaciones HTML autocontenidos.
Habilidades para agentes que enseñan a crear pantallas móviles nativas con Expo / React Native, inspiradas en el diseño de las apps más taquilleras.
Colección de 273 habilidades de diseño listas para agentes y 76 comandos slash para Claude Code y Gemini CLI, sobre investigación, sistemas, UI, interacción y entrega.
Kit de instrucciones y conocimientos que convierte Claude y otros agentes de programación en expertos en diseño UX/UI, con tokens DTCG, especificaciones de componentes, 138 sistemas de diseño y 52 comprobaciones objetivas.
Una skill de diseño de interfaces para agentes de IA que explora distintas propuestas, las compara en paralelo y las refina a partir de capturas de pantalla reales.
CLI que extrae el sistema de diseño de un sitio web, un repositorio git o una base de código local en una carpeta de archivos que Claude Code puede leer para crear una UI a juego.
Biblioteca de habilidades de diseño y prompts de UI, con CLI y conexión MCP, que ofrece sistemas de diseño y orientación sobre layouts a herramientas de programación con IA.
Una skill de agente que extrae la identidad visual de interfaces de referencia y la convierte en Design DNA estructurado en JSON, para luego generar interfaces que sigan ese estilo.
Servidor MCP gratuito y bidireccional para Figma que permite a agentes de programación convertir diseños en código y devolver diseños al lienzo.
Una skill para que los agentes de programación con IA creen sitios web de diseño cuidado y estilo premiado a partir de una sola línea, junto con la skill complementaria /jury, que los evalúa.
Una CLI que permite a un asistente de IA crear y editar diseños reales y editables en tu aplicación local Figma Desktop, sin necesidad de una clave de API.
Diseña pósteres, publicaciones para redes sociales, presentaciones y páginas de destino en GitHub Copilot, Claude Code, Codex o Cursor, sin necesidad de una aplicación de escritorio aparte.
Una habilidad para agentes que aporta criterio de diseño a Claude Code, Cursor y otros agentes de código al crear e iterar interfaces, presentaciones y gráficos.
Un Agent Skill con opiniones marcadas para Claude Code y clientes similares que aleja el diseño de UI generado por IA de las plantillas genéricas, con un selector de estilos visuales y 58 referencias de sistemas de diseño de sitios reales.
Una Agent Skill abierta y basada solo en texto que guía a agentes de IA para diseñar, generar, refinar y revisar iconos llamativos y divertidos para apps.
Servidor MCP y registro de shadcn/ui que proporciona a los agentes de programación sistemas de diseño, orientación sobre UI/UX, iconos y reglas para revisar la accesibilidad.
Una skill y una CLI que enseñan a los agentes de programación con IA a crear interfaces pulidas y listas para producción, en lugar de diseños genéricos que parecen generados por IA.
Skill de Claude Code que enseña a un agente de programación a crear, rediseñar y evaluar interfaces de dashboards claras y honestas, con una revisión de capturas de pantalla.
Conjunto de 24 skills de código abierto para orientar Claude Code, Codex, Cursor y opencode hacia interfaces menos genéricas y con un diseño más deliberado.
Una skill de diseño UI/UX para agentes de programación que guía la creación, el rediseño y la revisión de interfaces, junto con una CLI que inspecciona páginas en ejecución para detectar problemas de accesibilidad y diseño.
Skills de Claude Code para llevar diseños de Figma a una base de código y devolver el estado del código a Figma, además de una skill para gobernar el sistema de estilos.
Preguntas frecuentes
- ¿Cómo se eligen estos proyectos?
- Cada proyecto de Repolode pasa un filtro de calidad antes de publicarse: debe poder usarse hoy, resolver un problema concreto, ser algo más que un simple envoltorio y seguir mantenido. Esta página agrupa los proyectos por tema y los ordena por estrellas de GitHub.
- ¿Cuál es el proyecto más popular de esta lista?
- nextlevelbuilder/ui-ux-pro-max-skill, con 146,5 mil estrellas en GitHub. Revisa la licencia y el último commit de cada proyecto antes de elegir.