Uma skill para agentes de IA que oferece a assistentes de programação regras de design de UI/UX pesquisáveis, estilos, paletas, combinações de fontes e orientações específicas para cada stack.
Programação com IA
Skills de design de interface para agentes de programação: 29 projetos open source (2026)
Dê senso de design ao Claude Code, Codex e Cursor: skills e ferramentas para interfaces mais limpas e menos genéricas.
- Projeto
- 29
- Nesta semana
- +21,5 mil
- Atualizado
- há 4 horas
Como escolher
Decida primeiro o que você precisa: evitar interfaces genéricas do agente, ter um espaço de design completo ou reproduzir o visual de algo que já existe. O Nutlope/hallmark é uma skill para gerar UI que não pareça feita por IA. O nexu-io/open-design é um espaço local que transforma briefings em protótipos, apresentações e imagens. O amaancoderx/npxskillui extrai o sistema de design de um site ou código existente em arquivos que o Claude Code consegue ler.
- hallmarkIdeal para quem quer que Claude Code, Cursor ou Codex gerem uma UI que não pareça feita por IA, com uma única skill.
- open-designIdeal para quem quer um espaço local e de código aberto em que o próprio agente transforma briefings em protótipos, apresentações e imagens, no lugar do Figma.
- npxskilluiIdeal para quem precisa que o Claude Code construa uma UI alinhada ao sistema de design de um site, repositório ou código local existente.
Comparação dos principais projetos
| Projeto | Estrelas | Nesta semana | Licença | Atualizado |
|---|---|---|---|---|
| 146,5 mil | +3,1 mil | MIT | há 6 horas | |
| 111,6 mil | +4,7 mil | MIT | há 9 horas | |
| 106,5 mil | +1,3 mil | Apache-2.0 | há 4 horas | |
| 50,1 mil | +6,4 mil | MIT | anteontem | |
| 28,9 mil | +639 | MIT | há 4 dias | |
| 14,8 mil | +1,7 mil | MIT | há 6 dias |
Todos os projetos
Ordenar:Mais estrelas
Agent Skills que ajudam agentes de programação a criar interfaces diferenciadas, usando direção de arte, fotos reais e uma verificação no navegador em vez de landing pages genéricas feitas por IA.
Workspace local-first e open source de agentes de IA para design, que transforma briefings em protótipos, apresentações, dashboards, imagens e vídeos usando seu próprio agente de programação.
Uma skill de design para Claude Code, Cursor e Codex que orienta agentes de programação com IA a criar interfaces que não parecem geradas por IA.
Uma skill de design nativa em HTML para agentes de programação com IA, que transforma prompts em protótipos, apresentações, animações e infográficos.
Coleção de arquivos de habilidades de design independentes para ferramentas de programação com IA, como Claude Code, Cursor e Codex, começando com uma habilidade para landing pages.
Coleção selecionada de seis Skills para Claude Code, Cursor, Codex e agentes de programação com IA semelhantes, cobrindo design web, vídeo, imagens, artigos e busca em bases de conhecimento locais.
Regras e skills para evitar que agentes de programação com IA gerem interfaces genéricas, textos de marketing exagerados e comentários com cara de IA.
Uma Agent Skill que executa o Claude Design localmente no Cursor, Claude Code ou agentes similares para criar mockups, protótipos e apresentações em HTML autocontido.
Skills para agentes que ensinam agentes de programação com IA a criar telas mobile com qualidade nativa em Expo / React Native, inspiradas no design de apps de maior faturamento.
Coleção com 273 skills de design prontas para agentes e 76 slash commands para Claude Code e Gemini CLI, cobrindo pesquisa, sistemas, UI, interação e entrega.
Um kit de instruções e conhecimento que transforma Claude e outros agentes de programação em especialistas em design UX/UI, com tokens DTCG, especificações de componentes, 138 sistemas de design e 52 verificações objetivas.
Uma skill de design de interfaces para agentes de IA que explora diferentes direções visuais, compara opções lado a lado e as refina com base em screenshots reais.
CLI que extrai o design system de um site, repositório git ou base de código local para uma pasta de arquivos que o Claude Code pode ler para criar uma UI compatível.
Biblioteca de skills de design e prompts de UI, com CLI e conexão MCP, que oferece sistemas de design e orientações de layout para ferramentas de programação com IA.
Uma skill de agente que extrai a identidade visual de UIs de referência para um JSON estruturado de Design DNA e, em seguida, gera UIs correspondentes.
Um servidor MCP gratuito e bidirecional para Figma que permite a agentes de programação transformar designs do Figma em código e enviar designs de volta para o canvas.
Uma skill para agentes de programação com IA criarem sites premiados e bem projetados a partir de um briefing de uma linha, acompanhada da skill /jury para avaliar sites.
Uma CLI que permite a um assistente de IA criar e editar designs reais e editáveis no Figma Desktop local, sem precisar de uma chave de API.
Crie pôsteres, posts para redes sociais, apresentações e landing pages no GitHub Copilot, Claude Code, Codex ou Cursor, sem precisar de um app desktop separado.
Uma skill de agente que dá a agentes de programação, como Claude Code e Cursor, senso de design para criar e iterar em interfaces, apresentações e peças gráficas.
Uma Agent Skill com opiniões fortes para Claude Code e clientes semelhantes, que orienta o design de interfaces geradas por IA para longe de templates genéricos, com seletor de direções visuais e 58 referências de sistemas de design de sites reais.
Uma Agent Skill aberta e baseada apenas em texto que orienta agentes de IA a criar, gerar, refinar e revisar ícones de apps marcantes e divertidos.
Um servidor MCP e registry do shadcn/ui que fornece a agentes de programação sistemas de design, orientações de UI/UX, ícones e regras para revisar acessibilidade.
Uma skill de agente e CLI que ensinam agentes de programação com IA a criar interfaces refinadas e prontas para produção, em vez de designs genéricos com cara de IA.
Uma skill do Claude Code que ensina um agente de programação a criar, reformular e avaliar interfaces de dashboard limpas e honestas, com uma etapa de QA por screenshot.
Um conjunto de 24 skills open source para orientar Claude Code, Codex, Cursor e opencode a gerar interfaces menos genéricas e com decisões de design mais deliberadas.
Uma skill de UI/UX para agentes de programação, que orienta a criação, reformulação e revisão de interfaces, além de uma CLI que inspeciona páginas em execução em busca de problemas de acessibilidade e layout.
Skills do Claude Code que levam designs do Figma para a base de código e sincronizam o código de volta para o Figma, além de uma skill para governança do sistema de estilos.
Perguntas frequentes
- Como esses projetos são escolhidos?
- Cada projeto do Repolode passa por um filtro de qualidade antes de entrar: precisa funcionar hoje, resolver um problema concreto, ser mais do que um simples wrapper e continuar mantido. Esta página agrupa os projetos por tema e os ordena por estrelas no GitHub.
- Qual é o projeto mais popular desta lista?
- nextlevelbuilder/ui-ux-pro-max-skill, com 146,5 mil estrelas no GitHub. Confira a licença e o último commit de cada projeto antes de escolher.