Pular para o conteúdo
NovidadesIA

Agentes de IA

Kubai Icons: 2,800 ícones animados para agentes de IA, em um pacote pronto

Um desenvolvedor que precisa de ícones consistentes para um produto de código aberto — mas não quer perder tempo criando ou adaptando desenhos — encontra na ferramenta Kubai Icons uma solução que…

Edição: Anderson Gomes
· 3 min de leitura

Kubai Icons: 2,800 ícones animados para agentes de IA, em um pacote pronto
Imagem: Cartão · repositório kubai087/kubai-icons · cartão da plataforma · licença não declarada

O projeto, lançado em novembro de 2026, oferece um agent skill que gera ícones animados em estilo único, com 2,800 desenhos prontos para React, Vue e SVG. O que parece mágica é que a arquitetura funciona como um motor reutilizável: um agente (como o Claude Code ou o Codex) recebe uma descrição textual do que deve ser representado — um botão que abre, um ícone de exportação — e o skill gera o desenho, ajustando detalhes como tamanho, camadas e cores para que fique alinhado com o resto da biblioteca.

A instalação é simples: basta clonar o repositório e colar um trecho de código no agente. O skill então roda localmente, sem depender de serviços externos, mas exige um modelo de IA capaz de processar imagens, como o Claude Opus 5.5. A versão mais recente, [email protected], foi lançada em 9 de novembro e resolve um bug que deixava ícones com lacunas visuais em telas de baixa densidade.

O projeto tem 471 estrelas, zero issue aberta e foi criado por um desenvolvedor que, segundo o próprio, testou a ferramenta cegamente (blind-tested) para garantir consistência. A licença é não declarada, mas o README esclarece que os ícones são MIT-licenciados, permitindo uso livre em projetos de código aberto. A única restrição é que a ferramenta não serve para quem não tem acesso a um agente de IA capaz de processar prompts visuais — como modelos genéricos sem suporte para imagens.

--- ## Como funciona o motor de ícones animados

O skill funciona como um engine que segue um conjunto de regras predefinidas para criar ícones. Cada desenho é composto por três partes: um back piece (base), conteúdo opcional em branco e um front piece (parte frontal). As animações são baseadas em dois keyframes: o estado normal e o hover. Os tons e sombras derivam de um único valor de cor, garantindo que a biblioteca se recoloque automaticamente sem alterar o código.

Para testar a precisão, o skill executa um self-check que compara cada ícone gerado com os existentes, verificando detalhes como bordas, camadas e proporções. O resultado é uma biblioteca pronta para ser usada em qualquer projeto, com ícones em 900 formas distintas, incluindo versões "off" (desativadas) e badged (com etiquetas).

--- ## De onde vem o ícone que você precisa

Para usar Kubai Icons, o desenvolvedor precisa apenas descrever o que quer em texto simples. Por exemplo: "Um ícone de exportação que segue o estilo do projeto". O skill então gera o desenho, alinha-o com os padrões da biblioteca e retorna o código pronto para ser usado em React, Vue ou SVG. O site oficial, icons.kubai.design, permite visualizar, recolorar e baixar os ícones, além de exportar prompts para agentes de IA.

A adoção é rápida: basta clonar o repositório, instalar o skill no agente e restartar. A versão mais recente do Vue, por exemplo, já corrigiu um bug que deixava ícones com bordas desalinhadas em telas de baixa resolução. O projeto ainda não tem uma versão estável para mercado, mas o código é aberto e pode ser adaptado para outros agentes, desde que o desenvolvedor tenha um modelo que suporte imagens.

  • JavaScript
  • Agentes de IA
  • GitHub

Fonte: Repositório no GitHub · Como produzimos as matérias