Resumen de Paquetes Iconify

Múltiples paquetes de iconos Iconify están disponibles como paquetes npm con componentes Icon de Astro. Cada paquete tiene su propia importación y utiliza la misma API basada en name.

Comparación de Paquetes

Paquete	Prefijo	Iconos	Estilo	Ideal Para	Página
Material Design	`mdi`	7,638	Relleno + contorno	Uso general, mayor cobertura	Material Design
Carbon	`carbon`	2,582	Contorno	Diseño empresarial/IBM, líneas limpias	Carbon
Phosphor	`ph`	9,161	Múltiples grosores	Opciones flexibles de grosor (fino a relleno)	Phosphor
Tabler	`tabler`	6,034	Basado en trazo	Iconos de línea nítidos, trazo consistente	Tabler

Uso

Cada paquete tiene su propio 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" />

Los iconos se renderizan como SVGs en línea usando currentColor — se adaptan automáticamente al modo claro y oscuro.

Cómo Elegir un Paquete

Mayor cobertura: Material Design Icons tiene la mayor cantidad de iconos (7,638) con variantes rellenas y de contorno para prácticamente cualquier caso de uso.
Diseño empresarial: Carbon sigue el lenguaje de diseño de IBM con contornos limpios y consistentes, adecuados para aplicaciones de negocio.
Flexibilidad de grosor: Phosphor proporciona seis variantes de grosor (thin, light, regular, bold, fill, duotone) para ajustar con precisión el peso visual.
Trazos consistentes: Tabler utiliza un ancho de trazo uniforme de 2px en los 6,034 iconos para un aspecto cohesivo.

Consulte la página dedicada de cada paquete para ver cuadrículas de iconos seleccionados y enlaces de exploración.