> ## Documentation Index
> Fetch the complete documentation index at: https://adminroletesting-justin-client-exports.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Iconos

> Añade iconos de Font Awesome, Lucide, Tabler o fuentes personalizadas a tu documentación con el componente icono y opciones de tamaño y color.

Utiliza iconos de Font Awesome, Lucide, Tabler, SVG (Scalable Vector Graphics), URLs externas o archivos de tu proyecto para mejorar tu documentación.

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

```mdx Icon example theme={null}
<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 una oración, un párrafo o un encabezado. <Icon icon="flag" iconType="solid" /> Utiliza iconos con fines decorativos o para aportar énfasis visual.

```markdown Inline icon example theme={null}
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.
```

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

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

  Options:

  * [Font Awesome icon](https://fontawesome.com/icons) name, if you have the `icons.library` [property](/es/organize/settings#param-icons) set to `fontawesome` in your `docs.json`
  * [Lucide icon](https://lucide.dev/icons) name, if you have the `icons.library` [property](/es/organize/settings#param-icons) set to `lucide` in your `docs.json`
  * Nombre del [icono Tabler](https://tabler.io/icons), si tienes la `icons.library` [propiedad](/es/organize/settings#param-icons) configurada como `tabler` en tu `docs.json`
  * URL to an externally hosted icon
  * Path to an icon file in your project
</ResponseField>

<ResponseField name="iconType" type="string">
  The [Font Awesome](https://fontawesome.com/icons) icon style. Only used with Font Awesome icons.

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

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

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

<ResponseField name="className" type="string">
  Nombre de clase CSS personalizado para aplicar al icon.
</ResponseField>