> ## Documentation Index
> Fetch the complete documentation index at: https://mintlify-mintlify-add-i-to-quickstart-8818.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Iconos

> Usa iconos de bibliotecas de iconos populares

Usa iconos de Font Awesome, Lucide, SVG, URL externas o archivos de tu proyecto para mejorar tu documentación.

<Icon icon="flag" size={32} />

```mdx Ejemplo de icono
<Icon icon="flag" size={32} />
```

<div id="inline-icons">
  ## Iconos en línea
</div>

Los iconos se colocan en línea cuando se utilizan dentro de un párrafo.

<Icon icon="flag" iconType="solid" /> La documentación que necesitas, sin esfuerzo.

```markdown Ejemplo de icono en línea
<Icon icon="flag" iconType="solid" /> La documentación que quieres, sin complicaciones.
```

<div id="properties">
  ## Propiedades
</div>

<ResponseField name="icon" type="string" required>
  El ícono que se mostrará.

  Opciones:

  * Nombre del [ícono de Font Awesome](https://fontawesome.com/icons)
  * Nombre del [ícono de Lucide](https://lucide.dev/icons)
  * Código SVG compatible con JSX, envuelto entre llaves
  * URL de un ícono alojado externamente
  * Ruta a un archivo de ícono en tu proyecto

  Para íconos SVG personalizados:

  1. Convierte tu SVG con el [convertidor de SVGR](https://react-svgr.com/playground/).
  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.
</ResponseField>

<ResponseField name="iconType" type="string">
  El estilo del ícono de [Font Awesome](https://fontawesome.com/icons). Solo se usa con íconos de Font Awesome.

  Opciones: `regular`, `solid`, `light`, `thin`, `sharp-solid`, `duotone`, `brands`.
</ResponseField>

<ResponseField name="color" type="string">
  El color del icono como código hexadecimal (por ejemplo, `#FF5733`).
</ResponseField>

<ResponseField name="size" type="number">
  El tamaño del icono en píxeles.
</ResponseField>
