Repolode
Enviar
feimacode

feimacode/open-design-agent-kit

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.

Alternativa open source a:Canva

Ver no GitHubSite
Estrelas
1,028
Forks
100
Issues abertas
8
Último commit
ontem

O que é?

O Open Design Agent Kit reúne recursos de design, sistemas de identidade visual e exemplos remixáveis em agentes de programação como GitHub Copilot Chat, Claude Code, Codex e Cursor, ou em qualquer agente compatível com MCP. Você descreve um pitch deck, uma landing page, um dashboard ou um protótipo mobile no chat que já usa, e o modelo do próprio agente gera os arquivos com as ferramentas de manipulação de arquivos dele.

O kit inclui 198 sistemas de design, 181 skills, 114 templates e 193 exemplos prontos. O conteúdo gerado é salvo como arquivos comuns no seu repositório, podendo ser revisado, comparado em diffs e commitado como qualquer outro código. Os agentes renderizam cada design no navegador e verificam se há texto cortado, baixo contraste ou estados de foco ausentes antes de concluir.

A instalação pode ser feita como extensão do VS Code, plugin do Claude Code, conjunto de skills do Codex, servidor MCP ou com um comando npx de uma linha. Também é possível exportar para PDF, PNG e PowerPoint; alguns fluxos se conectam a serviços como Figma, Canva e Notion quando os servidores MCP correspondentes estão disponíveis.

Recursos principais

  • 01Funciona no GitHub Copilot Chat, Claude Code, Codex, Cursor e outros agentes compatíveis com MCP.
  • 02Inclui 198 sistemas de identidade visual para manter a consistência dos designs gerados.
  • 03Permite começar com 193 exemplos editáveis ou gerar a partir de um briefing.
  • 04Renderiza e verifica os designs no navegador antes de entregá-los.
  • 05Salva os resultados como arquivos comuns no repositório.
  • 06Exporta para PDF, PNG e PowerPoint.

Casos de uso

  • Criar artes para redes sociais ou pôsteres a partir de um prompt curto, direto no editor.
  • Rascunhar uma apresentação ou um protótipo de landing page antes de implementá-los no código de produção.
  • Transformar um CSV ou documento em um layout no estilo de relatório dentro do seu repositório.
  • Criar currículos prontos para impressão ou documentos de uma página e exportá-los como PDF.

Início rápido

  1. 1

    Execute a configuração com um único comando no seu projeto para conectar o Claude Code

    npx @feimacode/open-design-agent-kit init --tools claude
  2. 2

    Abra o chat do seu agente e descreva o design que você quer, como uma página de destino ou um pôster

Antes de usar

  • Ele funciona dentro de um agente de programação existente, então você precisa de um como Claude Code, Codex, GitHub Copilot ou Cursor.
  • As opções de instalação baseadas em npx exigem o Node.js.
  • Algumas integrações, como o Figma, precisam de tokens próprios ou de servidores MCP oficiais.

Em coleções

Skills de design de interface para agentes de programaçãoFerramentas, skills e plugins para Claude CodeAssistentes e agentes de programação com IAServidores MCPBibliotecas de skills para agentes de IA

Tópicos

#ai-design#design-systems#coding-agent#mcp#slides#poster#prototyping#claude-code#agent-skills#claude-design

Perguntas frequentes

O que é open-design-agent-kit?
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. O Open Design Agent Kit reúne recursos de design, sistemas de identidade visual e exemplos remixáveis em agentes de programação como GitHub Copilot Chat, Claude Code, Codex e Cursor, ou em qualquer agente compatível com MCP. Você descreve um pitch deck, uma landing page, um dashboard ou um protótipo mobile no chat que já usa, e o modelo do próprio agente gera os arquivos com as ferramentas de manipulação de arquivos dele.
open-design-agent-kit é gratuito? Qual é a licença?
open-design-agent-kit é open source sob a licença MIT. Confira os termos da licença antes de usá-lo em produtos comerciais.
open-design-agent-kit ainda é mantido?
Manutenção ativa. O último commit de open-design-agent-kit foi em 6 de nov. de 2026.
Para que posso usar open-design-agent-kit?
Criar artes para redes sociais ou pôsteres a partir de um prompt curto, direto no editor. Rascunhar uma apresentação ou um protótipo de landing page antes de implementá-los no código de produção. Transformar um CSV ou documento em um layout no estilo de relatório dentro do seu repositório. Criar currículos prontos para impressão ou documentos de uma página e exportá-los como PDF.
Como instalar open-design-agent-kit?
Execute a configuração com um único comando no seu projeto para conectar o Claude Code: npx @feimacode/open-design-agent-kit init --tools claude Abra o chat do seu agente e descreva o design que você quer, como uma página de destino ou um pôster
Onde consigo open-design-agent-kit?
O código-fonte e as instruções de instalação estão no GitHub: https://github.com/feimacode/open-design-agent-kit

Resumo gerado por IA a partir do README do projeto. As estatísticas do GitHub são atualizadas diariamente.

Projetos relacionados