Générateur de favicon

La petite icône de votre site dans les onglets, sur Google et sur l'écran d'accueil des téléphones. À partir de votre logo ou de vos initiales, en quelques secondes. Rien n'est envoyé : tout se fait dans votre navigateur.

Première fois ? Le déroulé, pas à pas

Appuyez sur « Choisir mon logo », ou passez à l'onglet « Des initiales » et tapez vos lettres.
Réglez la forme (« Carré », « Arrondi » ou « Rond »), la « Marge autour » et la couleur de fond en surveillant l'aperçu : onglet clair, onglet sombre, résultats Google et écran d'accueil.
Remplissez « Nom du site (pour les téléphones) » : c'est le nom affiché sous l'icône sur l'écran d'accueil.
Appuyez sur « Tout télécharger (.zip) », ou sur « Icône pour WordPress (512 px) » si votre site est sous WordPress.

Conseils

Fond transparent : l'icône de l'iPhone ne peut pas l'être, elle prend la « Couleur de fond » ; choisissez-la même si vous gardez la transparence.
Regardez l'aperçu sur l'onglet sombre : un logo foncé sur fond transparent s'y voit mal.
Wix, Squarespace, Shopify, Jimdo : l'image de 512 pixels du bouton « Icône pour WordPress (512 px) » suffit, à envoyer dans le réglage d'icône du service.
La nouvelle icône n'apparaît pas ? Les navigateurs gardent longtemps l'ancienne : vérifiez dans une fenêtre de navigation privée.

Choisir mon logo

ou glissez-le ici. SVG ou PNG carré d'au moins 512 pixels : le meilleur résultat.

Garder le fond transparent

Couleur de fond

Utilisée aussi pour l'icône de l'iPhone, qui ne peut pas être transparente.

Forme

Carré Arrondi Rond

Marge autour

6 %

Nom du site (pour les téléphones)

Aperçu

Actualités

Météo

Dans les résultats Google

https://votre-site.fr

Sur l'écran d'accueil

iPhone

Android

Votre logo reste sur votre appareil : les icônes sont fabriquées par votre navigateur, rien n'est envoyé ni enregistré.

Installer les icônes

Comment installer la favicon sur WordPress ?

Cliquez sur « Icône pour WordPress (512 px) » ci-dessus.
Dans l'administration : Apparence › Personnaliser › Identité du site › Icône du site (ou, avec un thème récent, Réglages › Général › Icône du site).
Choisissez l'image, puis Publier. WordPress fabrique lui-même les autres tailles : pas besoin du .zip.

Comment l'installer sur un site fait main (HTML, PHP) ?

Téléchargez le .zip et décompressez-le.
Déposez les fichiers à la racine du site (à côté de la page d'accueil), par FTP ou avec le gestionnaire de fichiers de votre hébergeur.
Collez le code ci-dessus dans la partie <head> de chaque page.

Et sur Wix, Squarespace, Shopify ou Jimdo ?

Ces services ont leur propre réglage, souvent nommé « Favicon » ou « Icône du site » dans les paramètres du site. Envoyez-y l'image de 512 pixels (bouton « Icône pour WordPress ») : elle convient partout.

Bon à savoir

Que faire si mon logo est illisible en tout petit ?

Dans un onglet, l'icône fait 16 pixels : un texte ou des détails fins disparaissent. Gardez seulement le symbole de votre logo, ou passez aux initiales.
Un logo très allongé devient minuscule dans un carré : utilisez sa partie gauche (le symbole) ou la première lettre.
Réduisez la marge pour que le dessin remplisse mieux le carré.

Pourquoi ne vois-je pas ma nouvelle icône ?

Les navigateurs gardent l'ancienne icône longtemps en mémoire. Ouvrez votre site dans une fenêtre de navigation privée pour vérifier. Sur Google, le changement peut prendre quelques jours à quelques semaines.

À quoi servent tous ces fichiers ?

favicon.ico : l'onglet du navigateur et les favoris, lu partout, même par les anciens logiciels.
icon.svg (si votre logo est en SVG) : une icône nette à toutes les tailles pour les navigateurs récents.
apple-touch-icon.png : l'icône quand on ajoute votre site à l'écran d'accueil d'un iPhone ou d'un iPad.
icon-192.png, icon-512.png, icon-maskable-512.png et site.webmanifest : la même chose pour Android, qui découpe l'icône en rond ou en carré arrondi.

Quelle taille doit faire une favicon ?

Il n'y a pas une taille, mais plusieurs : 16, 32 et 48 pixels dans le fichier favicon.ico pour les onglets et les favoris, 180 pixels pour l'iPhone, 192 et 512 pixels pour Android. L'outil les produit toutes à partir d'une seule image ; partez d'un logo carré d'au moins 512 pixels, ou d'un SVG.

Mon logo est-il envoyé sur un serveur ?

Non. Les icônes sont dessinées dans votre navigateur, sur votre appareil : le logo que vous choisissez n'est ni envoyé ni conservé.

Vérifier ensuite votre site avec le diagnostic complet