Tutoriel pour apprendre à utiliser et modifier des icônes Font Awesome sur Illustrator gratuitement et pour pouvoir les personnaliser.

1. Votre Assistante : https://www.votreassistante.net - le 22/02/2022
Article écrit par Lydia Provin du site
Votre Assistante : https://www.votreassistante.net
1
Comment utiliser et modifier des icônes Font Awesome sur Illustrator ?
Il existe une bibliothèque d’icônes gratuites et payantes, très utilisée par les développeurs
web et les graphistes, qui s’appelle Font Awesome. Celle-ci met à votre disposition plus de
1 500 icônes gratuites et plusieurs milliers d’icônes payantes que vous pouvez utiliser dans
tous vos projets.
Dans ce tutoriel, je vais vous montrer comment utiliser une icône de cette bibliothèque sur
Illustrator et comment la modifier si besoin.
Comment utiliser les icônes de Font Awesome sur Illustrator ?
Télécharger des icônes Font Awesome
Pour utiliser les icônes de Font Awesome, vous devez, tout d’abord, les télécharger. Pour cela,
rendez-vous sur le site de Font Awesome, cliquez sur Start for Free, puis, un peu plus bas, sur
Download et, enfin, sur Free For Desktop à droite (ou Pro For Desktop si vous souhaitez
avoir accès aux icônes payantes et donc choisir un plan payant) : selon vos paramètres, votre
navigateur vous demandera un emplacement où enregistrer le fichier compressé (ZIP) ou
l’enregistrera d’office.
Une fois téléchargé, décompressez-le. J’utilise personnellement 7-Zip qui est gratuit donc je
fais un clic droit dessus > 7-Zip > Extraire vers "fontawesome-free-6.0.0-desktop", puis je
supprime l’archive et peux ouvrir le dossier décompressé.
Ici, c’est le dossier svgs qui m’intéresse et, plus particulièrement, regular. Comme j’ai défini
l’utilisation de Firefox pour l’ouverture des fichiers SVG, par un double-clic sur un des fichiers,
l’icône est ouverte dans mon navigateur.
Rechercher des icônes Font Awesome
Pour retrouver plus facilement une icône, je vous conseille d’utiliser la recherche sur Font
Awesome où, pour cet exemple, je vais appliquer le filtre Free puisque j’ai des icônes gratuites

2. Votre Assistante : https://www.votreassistante.net - le 22/02/2022
Article écrit par Lydia Provin du site
Votre Assistante : https://www.votreassistante.net
2
et Regular puisque je suis dans ce dossier sur mon ordinateur. Si je recherche l’icône de smiley
avec des étoiles dans les yeux, je vois qu’elle s’appelle face-grin-stars :
Je peux donc la retrouver dans le dossier regular, sur mon ordinateur, sous ce nom.
Ouvrir des icônes Font Awesome avec Illustrator
Lorsque j’ai identifié l’icône que je souhaite utiliser dans Illustrator, je fais un clic droit
dessus > Ouvrir avec > Adobe Illustrator 2022 : mon icône s’ouvre dans Illustrator. La même
chose peut être effectuée dans Illustrator via le menu Fichier > Ouvrir… ou Ctrl + O (ou
Cmd + O sur Mac).
Je peux maintenant l’utiliser dans mes projets en la déplaçant, en la redimensionnant, etc.
Comment modifier les icônes de Font Awesome sur Illustrator ?
Si vous faites un clic droit sur l’icône, vous voyez que vous ne pouvez pas dissocier les tracés
pour, par exemple, mettre les étoiles d’une couleur différente du reste.
Pour remédier à cela, je vais utiliser le Pathfinder en affichant la fenêtre via le menu
Fenêtre > Pathfinder ou en faisant Ctrl + Maj + F9 (ou Cmd + Maj + F9 sur Mac).
En gardant l’icône sélectionnée avec l’Outil Sélection , je clique sur Réunion du
Pathfinder et, enfin, je fais un clic droit sur l’icône > Dissocier. Je fais un clic ailleurs et je peux
désormais personnaliser chaque élément.
Pour cet exemple, je sélectionne les 2 étoiles et leur applique une couleur violette (#9910E8) :

3. Votre Assistante : https://www.votreassistante.net - le 22/02/2022
Article écrit par Lydia Provin du site
Votre Assistante : https://www.votreassistante.net
3
Si vous aimez ce genre d’icônes, n’hésitez pas à m’en faire part et à me dire s’il y a des icônes
que vous souhaiteriez que je crée pour de prochains tutoriels Illustrator.
Enfin, si vous souhaitez bien débuter avec Illustrator, les 25 pas-à-pas pour Illustrator vous
permettront de vous familiariser avec les différents outils de ce logiciel.
Tutoriel réalisé avec Illustrator CC 2022
Voir la version vidéo de cet article