Saltar al contenido principal
Utiliza iconos de Font Awesome, Lucide, Tabler, SVG (Scalable Vector Graphics), URLs externas o archivos de tu proyecto para mejorar tu documentación.
Icon example
<Icon icon="flag" size={32} />

Iconos de imagen personalizados

Usa la prop src para mostrar una imagen personalizada como icono. La imagen puede ser un archivo de tu proyecto o una URL alojada externamente.
Custom image examples
<Icon src="/images/mi-icono.svg" />

<Icon src="https://example.com/icon.png" />

Iconos en línea

Los iconos se colocan en línea cuando se utilizan dentro de una oración, un párrafo o un encabezado. Utiliza iconos con fines decorativos o para aportar énfasis visual.
Inline example
Los iconos se colocan en línea cuando se usan dentro de una oración, párrafo o encabezado. <Icon icon="flag" iconType="solid" /> Usa iconos para decoración o para añadir énfasis visual.

Propiedades

Debes proporcionar icon o src.
icon
string
El icono que se mostrará desde una biblioteca de iconos.Options:
src
string
Ruta o URL de una imagen para usar como icono. Usa src en lugar de icon cuando quieras utilizar una imagen personalizada en lugar de un icono de una biblioteca.Options:
  • Ruta a un archivo de imagen en tu proyecto (por ejemplo, /images/mi-icono.svg)
  • URL de una imagen alojada externamente (por ejemplo, https://example.com/icon.png)
iconType
string
The Font Awesome icon style. Only used with Font Awesome icons.Options: regular, solid, light, thin, sharp-solid, duotone, brands.
color
string
El color del icon como código hexadecimal (por ejemplo, #FF5733).
size
number
El tamaño del icon en píxeles.
className
string
Nombre de clase CSS personalizado para aplicar al icon.