Générateur de favicon
Déposez une image carrée : l'outil génère dans votre navigateur les tailles de favicon standard (16x16, 32x32, 180x180 apple-touch-icon, 192x192, 512x512), téléchargeables individuellement.
Une seule image ne suffit plus : un site a besoin d’une icône d’onglet, d’une icône d’écran d’accueil iOS et de deux tailles pour les manifestes d’application. Cet outil génère les cinq fichiers PNG correspondants depuis une image unique, dans votre navigateur. Il s’adresse à ceux qui lancent un site ou refont leur identité et ne veulent pas gérer cinq exports à la main dans un logiciel graphique.
Les cinq tailles générées et leur usage
16 par 16 et 32 par 32 pixels sont les icônes d’onglet et de favoris : la première pour les affichages compacts, la seconde pour les écrans à haute densité et la barre d’adresse. 180 par 180 correspond à l’apple-touch-icon, l’icône utilisée quand un visiteur ajoute votre site à l’écran d’accueil d’un iPhone ou d’un iPad. 192 et 512 pixels sont les deux tailles attendues par un manifeste web sur Android et pour une application web installable : la plus grande servant aussi d’écran de démarrage.
Le traitement est identique pour toutes : l’image est recadrée au centre sur son plus grand carré inscrit, puis redessinée sur un canvas à la taille cible avec le lissage réglé sur haute qualité, et exportée en PNG. C’est pour cette raison qu’une source carrée est préférable : une image 1600 par 900 perdra ses bords gauche et droit dans le recadrage.
Un conseil de conception plus important que l’outil lui-même : à 16 pixels de côté, il ne reste presque rien. Un logo complet avec baseline devient une tache. Partez d’un symbole simple, d’une initiale ou d’une forme géométrique, avec un contraste marqué, et vérifiez le rendu à 16 pixels dans l’aperçu avant de valider.
Ce que la favicon change vraiment
Google affiche la favicon à côté de chaque résultat de recherche sur mobile. Ce n’est pas un critère de classement, mais c’est un élément de reconnaissance visuelle dans une liste de résultats : à position égale, une icône nette et identifiable se remarque plus qu’un globe gris par défaut. Google impose ses propres conditions (icône multiple de 48 pixels, accessible au crawl, servie depuis une URL stable) et peut ignorer un fichier qui ne les remplit pas.
Le reste de l’intérêt est ailleurs, dans l’usage quotidien : un visiteur avec vingt onglets ouverts retrouve le vôtre à l’icône, pas au titre tronqué. Sur mobile, une apple-touch-icon absente fait que iOS génère une capture d’écran de la page à sa place, un rendu généralement médiocre. Ce sont de petits détails de finition, sans effet mesurable sur les positions, mais visibles par tous vos visiteurs.
Cas d’usage concrets
Lancement de site
Produire d’un coup les cinq fichiers à déposer à la racine, sans ouvrir un logiciel graphique ni exporter chaque taille manuellement.
Changement d’identité
Régénérer toutes les tailles depuis le nouveau symbole, afin qu’aucune ancienne icône ne subsiste dans un coin du site.
Vérifier la lisibilité
Comparer le rendu d’un logo à 16 et à 512 pixels avant de le figer, et détecter les détails qui disparaissent en petite taille.
Ce que cet outil ne fait pas
L’outil ne produit pas de fichier .ico multi-résolutions ni d’icône SVG monochrome, deux formats encore utiles dans certains contextes. Il ne génère pas non plus le site.webmanifest, ni les balises link à placer dans le head : ces étapes restent manuelles. Et bien sûr, une favicon soignée n’a aucun effet sur votre positionnement : c’est de la finition visuelle, pas du référencement.
Pour aller plus loin
- Compresseur d’images : préparer et alléger l’image source avant d’en tirer les tailles d’icône.
- Générateur de balises meta : produire le bloc head dans lequel référencer ces icônes.
Questions fréquentes
Quelles tailles de favicon sont générées ?+
16x16 et 32x32 pour les onglets de navigateur, 180x180 pour l'apple-touch-icon iOS, ainsi que 192x192 et 512x512 pour les icônes d'application (Android, PWA).
Pourquoi utiliser une image carrée en entrée ?+
Une image non carrée est recadrée automatiquement au centre pour obtenir un carré avant redimensionnement, ce qui peut couper les bords. Partir d'un carré évite ce recadrage.
Comment relier ces favicons à mon site ?+
Déposez les fichiers téléchargés à la racine de votre site puis référencez-les avec des balises <link rel="icon"> et <link rel="apple-touch-icon"> dans le <head> de vos pages.
Faut-il encore un fichier favicon.ico ?+
Tous les navigateurs actuels lisent des PNG déclarés par une balise link, donc le .ico n'est plus indispensable. Le garder à la racine reste une précaution utile : certains agents et lecteurs de flux le demandent directement, sans lire le HTML.
Pourquoi Google n'affiche-t-il pas ma favicon dans les résultats ?+
Google applique ses propres conditions : icône carrée dont la taille est un multiple de 48 pixels, servie depuis une URL stable et accessible au crawl, sur un domaine qu'il juge fiable. La mise à jour peut aussi prendre plusieurs semaines après un changement, le temps qu'il recrawle la racine du site.
Une favicon influence-t-elle le référencement ?+
Non, ce n'est pas un facteur de classement. Elle joue sur la reconnaissance de la marque dans une liste de résultats mobiles et dans une barre d'onglets, ce qui peut marginalement aider le taux de clic. Traitez-la comme un détail de finition, pas comme une action SEO.
Envie d’automatiser tout votre SEO ?
GetRerank prolonge ces outils gratuits avec un plan de contenu, la rédaction et la publication automatiques, mesurés sur Google et six moteurs IA.
Découvrir GetRerank