mirror of
https://github.com/mintlify/docs.git
synced 2026-09-14 13:35:46 +08:00
5976d9dcd4
* docs: document src prop on Icon component * Update snippets/icons-required.mdx --------- Co-authored-by: mintlify[bot] <109931778+mintlify[bot]@users.noreply.github.com> Co-authored-by: Ethan Palm <56270045+ethanpalm@users.noreply.github.com>
56 lines
1.8 KiB
Plaintext
56 lines
1.8 KiB
Plaintext
---
|
||
title: "Icônes"
|
||
description: "Ajoutez des icônes Font Awesome, Lucide, Tabler ou de sources personnalisées à vos pages avec le composant icône et ses options de taille et de couleur."
|
||
keywords: ["Font Awesome", "Lucide", "Tabler", "SVG"]
|
||
boost: 3
|
||
---
|
||
|
||
import IconsRequired from "/snippets/fr/icons-required.mdx";
|
||
|
||
Utilisez des icônes de Font Awesome, Lucide, Tabler, des SVG (Scalable Vector Graphics), des URL externes ou des fichiers de votre projet pour enrichir votre documentation.
|
||
|
||
<Icon icon="flag" size={32} />
|
||
|
||
```mdx Icon example
|
||
<Icon icon="flag" size={32} />
|
||
```
|
||
|
||
## Icônes d’image personnalisées
|
||
|
||
Utilisez la prop `src` pour afficher une image personnalisée en guise d’icône. L’image peut être un fichier de votre projet ou une URL hébergée en externe.
|
||
|
||
```mdx Custom image icon examples
|
||
<Icon src="/images/mon-icone.svg" />
|
||
|
||
<Icon src="https://example.com/icon.png" />
|
||
```
|
||
|
||
|
||
<div id="inline-icons">
|
||
## Icônes en ligne
|
||
</div>
|
||
|
||
Les icônes sont placées en ligne lorsqu’elles sont utilisées dans une phrase, un paragraphe ou un titre. <Icon icon="flag" iconType="solid" /> Utilisez les icônes pour la décoration ou pour renforcer l’accent visuel.
|
||
|
||
```markdown Inline icon example
|
||
Les icônes sont placées en ligne lorsqu'elles sont utilisées dans une phrase, un paragraphe ou un titre. <Icon icon="flag" iconType="solid" /> Utilisez des icônes pour décorer ou ajouter un accent visuel.
|
||
```
|
||
|
||
|
||
<div id="properties">
|
||
## Propriétés
|
||
</div>
|
||
|
||
<IconsRequired />
|
||
|
||
<ResponseField name="color" type="string">
|
||
La couleur de l’icon sous forme de code hexadécimal (par exemple « #FF5733 »).
|
||
</ResponseField>
|
||
|
||
<ResponseField name="size" type="number">
|
||
La taille de l’icon en pixels.
|
||
</ResponseField>
|
||
|
||
<ResponseField name="className" type="string">
|
||
Nom de classe CSS personnalisé à appliquer à l’icon.
|
||
</ResponseField> |