Visão Geral dos Pacotes Iconify

Múltiplos pacotes de ícones Iconify estão disponíveis como pacotes npm com componentes Icon do Astro. Cada pacote possui sua própria importação e utiliza a mesma API baseada em name.

Comparação de Pacotes

Pacote	Prefixo	Ícones	Estilo	Melhor Para	Página
Material Design	`mdi`	7.638	Preenchido + contorno	Uso geral, cobertura mais ampla	Material Design
Carbon	`carbon`	2.582	Contorno	Design empresarial/IBM, linhas limpas	Carbon
Phosphor	`ph`	9.161	Múltiplos pesos	Opções flexíveis de peso (fino a preenchido)	Phosphor
Tabler	`tabler`	6.034	Baseado em traço	Ícones de linha nítidos, traço consistente	Tabler

Uso

Cada pacote possui seu próprio componente Icon.astro:

---
import MdiIcon from '@f5-sales-demo/icons-mdi/Icon.astro';
import CarbonIcon from '@f5-sales-demo/icons-carbon/Icon.astro';
import PhIcon from '@f5-sales-demo/icons-phosphor/Icon.astro';
import TablerIcon from '@f5-sales-demo/icons-tabler/Icon.astro';
---

<MdiIcon name="database" />
<CarbonIcon name="cloud" />
<PhIcon name="globe" />
<TablerIcon name="shield" />

Os ícones são renderizados como SVGs inline usando currentColor — eles se adaptam automaticamente aos modos claro e escuro.

Escolhendo um Pacote

Cobertura mais ampla: Material Design Icons possui o maior número de ícones (7.638) com variantes preenchidas e com contorno para praticamente todos os casos de uso.
Design empresarial: Carbon segue a linguagem de design da IBM com contornos limpos e consistentes, adequados para aplicações corporativas.
Flexibilidade de peso: Phosphor oferece seis variantes de peso (thin, light, regular, bold, fill, duotone) para ajuste fino do peso visual.
Traços consistentes: Tabler utiliza uma largura de traço uniforme de 2px em todos os 6.034 ícones para uma aparência coesa.

Consulte a página dedicada de cada pacote para grades de ícones selecionados e links de navegação.