Créer un favicon à partir d’un logo : tailles, formats et checklist
Créez un favicon net à partir de votre logo, choisissez les bonnes tailles SVG, PNG et ICO, et évitez les détails illisibles dans un onglet.
Réponse rapide
Pour créer un favicon à partir d’un logo, gardez son élément le plus reconnaissable, placez-le sur un carré, retirez les petits textes et testez-le en 16 et 32 pixels. Commencez avec le générateur de favicon, puis conservez un SVG maître et des fichiers PNG de secours.
Choisir la partie du logo qui reste lisible
Un logotype horizontal devient souvent illisible dans un onglet. Préférez le symbole, un monogramme ou une lettre épaisse. Gardez un contraste fort et de l’espace libre. Si la source est floue, vectorisez d’abord le logo afin de préserver les courbes.
| Source | Traitement conseillé | Problème courant |
|---|---|---|
| Symbole et nom | Garder le symbole | Le texte devient un trait |
| Monogramme | Centrer une ou deux lettres | Les traits fins disparaissent |
| Illustration détaillée | Simplifier en silhouette | Les formes fusionnent |
| Logo transparent | Tester sur clair et sombre | Contraste insuffisant |
Produire les fichiers
- Utilisez un canevas carré 1:1.
- Choisissez une transparence ou un fond volontaire.
- Vérifiez le rendu en 16, 32 et 48 pixels.
- Exportez un SVG et des PNG de secours, par exemple 48, 192 et 512 pixels.
- Ajoutez le lien dans le head et gardez une URL stable.
Google exige un favicon carré et recommande une source supérieure à 48 par 48 pixels. Consultez la documentation officielle de Google.
Checklist qualité
- La forme principale reste identifiable à 16 pixels.
- Les slogans et mentions fines ont disparu.
- Les bords transparents sont propres.
- Les thèmes clair et sombre fonctionnent.
- Le fichier est public, explorable et stable.
- Le SVG est optimisé sans supprimer sa viewBox.
Questions fréquentes
Quelle taille choisir pour un favicon ?
Utilisez un maître vectoriel et testez 16 et 32 pixels. Pour Google, le fichier doit être carré et mesurer au moins 8 par 8 pixels ; une source de plus de 48 par 48 est recommandée.
Faut-il choisir SVG, PNG ou ICO ?
SVG reste net dans les navigateurs modernes, PNG constitue un bon secours et ICO couvre les anciens environnements. Un ensemble complet peut contenir les trois.
Puis-je utiliser le logo entier ?
Oui, seulement s’il reste reconnaissable dans un onglet. Pour un logo horizontal, le symbole ou les initiales sont généralement plus efficaces.