SVG estático

kubai-icons-static fornece cada ícone como um arquivo SVG autônomo. As cores ficam gravadas no arquivo, então não é preciso script nem folha de estilo.

Instalar

bash
npm install kubai-icons-static

Arquivos

svg/ contém todos os ícones no azul padrão (#5393FF). svg-soft/ contém todos os ícones na variante suave, em azul-acinzentado.

Cada arquivo inclui uma margem extra para a sombra projetada. Para equivaler a um ícone animado exibido a 24px, exiba o arquivo a 28px. Cada id de um arquivo inclui o nome do ícone, então vários ícones podem ser incorporados em uma mesma página.

CDN

Use os arquivos diretamente de uma CDN:

html
<img src="https://cdn.jsdelivr.net/npm/kubai-icons-static@0/svg/folder.svg" width="28" height="28" alt="" />

Qualquer cor

Os arquivos acima vêm em duas cores. Para outra cor de destaque, solicite o ícone por URL. Isso também serve a agentes e ferramentas que não conseguem instalar pacotes.

html
<img src="https://icons.kubai.design/api/icon/folder.svg?color=EC4899" width="28" height="28" alt="" />
  • color: um valor hexadecimal de seis dígitos, com ou sem #. Padrão: 5393FF.
  • variant: color ou soft.
  • badge: semantic ou um valor hexadecimal, para ícones com selo.
  • size: largura e altura em pixels, de 16 a 2048. Padrão: 96.

No jsDelivr, uma URL com versão exata fica em cache por longo prazo. Uma URL com versão principal, como @0, é atualizada periodicamente e recebe as novas versões.

Cores personalizadas

No explorador de ícones, você pode baixar um ícone como SVG ou PNG, na cor e na variante escolhidas. Esses arquivos usam cores hexadecimais simples, que ferramentas de design como o Figma leem corretamente.

Metadados

icons.json lista todos os ícones com categoria e tags e, para ícones com selo, o ícone base e o selo. categories.json lista as categorias.

Kubai Icons é de uso gratuito. Apoie o projeto