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

​
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

​
icon
string
required
El icono que se mostrará.Opciones:
  • Nombre de icono de Font Awesome
  • Nombre de icono de Lucide
  • Código SVG compatible con JSX envuelto entre llaves
  • URL a un icono alojado externamente
  • Ruta a un archivo de icono en tu proyecto
Para iconos SVG personalizados:
  1. Convierte tu SVG usando el convertidor SVGR.
  2. Pega tu código SVG en el campo de entrada de SVG.
  3. Copia el elemento completo <svg>...</svg> del campo de salida de JSX.
  4. Envuelve el código SVG compatible con JSX entre llaves: icon={<svg ...> ... </svg>}.
  5. Ajusta height y width según sea necesario.
​
iconType
string
El estilo de icono de Font Awesome. Solo se usa con iconos de Font Awesome.Opciones: regular, solid, light, thin, sharp-solid, duotone, brands.
​
color
string
El color del icon en formato hexadecimal (por ejemplo, #FF5733).
​
size
number
El tamaño del icon en píxeles.