# LogoIcon > Une icône SVG posée dans la page à la génération. Le fichier est lu à la génération et son contenu posé dans la page. C'est ce qui lui permet de prendre sa couleur de `currentColor` et d'être dimensionnée comme le texte — impossible par une balise `img`, qui isole le document. ## Une icône ```mdx ``` Un chemin relatif part de la page, un chemin absolu du dossier de version. Rien ne peut en sortir : une page ne lit pas le reste de la machine. ## Elle suit le texte Posée dans un texte, l'icône en prend la taille et la couleur.
à la taille et à la couleur du texte
et ici, plus petite et plus grise
à la taille et à la couleur du texte
et ici, plus petite et plus grise
## Tailles `size` accepte n'importe quelle longueur CSS.
```mdx ``` ```mdx ``` `green` vient de `theme/99-docpensieve.css`, et pose `color`. La couleur ne suit que si le fichier s'en remet à `currentColor` plutôt qu'à une couleur fixe. ## Dans une liste
  • Aucun script à charger
  • Les liens sont relus avant publication
  • Une version par branche
## En tête d'une carte Rapide Aucune hydratation, aucun paquet à télécharger avant de lire. Vérifié Les liens morts et le balisage invalide arrêtent la publication. ## Décorative ou porteuse de sens Sans `label`, l'icône est traitée comme décorative et masquée aux lecteurs d'écran — ce qui est juste quand un texte voisin dit déjà la même chose. Avec `label`, elle devient une image décrite. ```mdx ``` Dans la liste ci-dessus, les icônes n'ont pas de `label` : le texte à côté porte déjà le sens, et l'annoncer deux fois n'apprendrait rien. ## Une icône issue d'un jeu À côté d'un fichier de votre projet, `src` accepte le nom d'une icône d'une collection, écrit `prefix:nom` : ```mdx ``` Le jeu est un paquet que votre projet installe, et le dessin est posé dans la page à la génération, exactement comme le serait un fichier à vous : ```bash npm install --save-dev @iconify-json/simple-icons ``` Rien n'est récupéré pendant la lecture de la page — ces collections proposent un service en ligne, qui demanderait une requête par icône et un script pour la faire. Un jeu non installé arrête la génération en nommant le paquet à installer ; un nom que le jeu ne contient pas aussi. ## Ce qu'elle refuse Un fichier manquant, un fichier sans balise `svg`, une cible qui sort du dossier de version : chacun arrête la génération, en nommant le chemin attendu. Une icône manquante laisserait sinon un carré vide que personne ne remarque. Les scripts et les gestionnaires d'événements présents dans un fichier sont retirés avant l'intégration. Un composant ne charge aucun JavaScript, et celui-ci ne va pas commencer. Un type d'admonition prend sa marque par ce même composant — voir [Admonition](/versions/beta/fr/components/admonition/). ## Propriétés | Propriété | Type | Effet | | ----------- | -------- | ----------------------------------------------------------------------------------------- | | `src` | `string` | Un SVG du projet, ou `prefix:name` d'un jeu d'icônes installé. | | `label` | `string` | Ce que signifie l'icône. Sans lui, l'icône est décorative et cachée aux lecteurs d'écran. | | `size` | `string` | Toute longueur CSS. | | `className` | `string` | Classes ajoutées à l'icône. | | `style` | `object` | Styles en ligne sur l'icône. |