Générateur de favicon
Créez un favicon à partir de lettres, d’un emoji ou d’une image. Obtenez favicon.ico, les icônes Apple et Android, le manifeste et les balises HTML.
Aperçu
Affiché en taille réelle : 16, 32, 48 et 180 px. Vérifiez qu’il reste lisible à 16 px.
Le ZIP contient : favicon.ico (16, 32, 48), favicon-16x16.png, favicon-32x32.png, apple-touch-icon.png (180), android-chrome-192x192.png, android-chrome-512x512.png, site.webmanifest, favicon-tags.html
Balises pour le <head> de votre HTML
<link rel="icon" href="/favicon.ico" sizes="48x48">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">Placez les fichiers à la racine de votre site (ex. https://votre-domaine/favicon.ico), puis ajoutez ces balises dans le <head> de chaque page.
Tout est traité dans votre navigateur. Rien n’est envoyé à nos serveurs.
Guide
À retenir
- Crée un pack de favicons complet pour navigateurs, iPhone et Android à partir d'un texte, d'un emoji ou d'une image.
- Envoyez les fichiers à la racine du site et collez les balises HTML dans le <head>.
- Une ou deux lettres ou un symbole simple restent lisibles à 16 px.
Qu’est-ce qu’un favicon ?
La petite icône affichée dans les onglets, les favoris, les résultats de recherche et sur l’écran d’accueil des téléphones. Google l’affiche à côté du nom de votre site dans les résultats — sans favicon, vous avez un globe générique.
Les fichiers du pack
- favicon.ico (16, 32, 48 px) — onglets, anciens navigateurs, résultats de recherche
- favicon-16x16.png, favicon-32x32.png — onglets et favoris des navigateurs récents
- apple-touch-icon.png (180 px) — « Sur l’écran d’accueil » sur iPhone et iPad
- android-chrome-192x192.png, 512x512.png — écran d’accueil Android et applis web installables
- site.webmanifest — icône, nom et couleur de thème pour Android
L’ajouter à votre site
- Décompressez et envoyez tous les fichiers à la racine de votre site.
- Collez les balises de
favicon-tags.htmldans le<head>de chaque page. - Sous WordPress, envoyez le PNG de 512 px dans Apparence → Personnaliser → Identité du site → Icône du site.
- Les navigateurs gardent longtemps les favicons en cache — faites un rechargement forcé (Ctrl+F5) ou ouvrez une fenêtre privée.
Conseils pour un favicon lisible
- À 16 px, une ou deux lettres ou un symbole simple se lisent le mieux ; un logo complet devient flou.
- Misez sur un fort contraste et vérifiez l’aperçu sur onglets clairs et sombres.
- Avec un fond transparent, l’icône Apple est remplie en blanc, car iOS affiche la transparence en noir.
Questions fréquentes
Le favicon.ico ne suffit-il pas ?
Il couvre les onglets, mais les téléphones ont besoin d'icônes PNG plus grandes quand on ajoute votre site à l'écran d'accueil. Le pack complet est recommandé.
J'ai changé mon favicon mais je vois toujours l'ancien.
Les navigateurs gardent les favicons en cache. Essayez un rechargement forcé (Ctrl+F5) ou une fenêtre privée. Les résultats de recherche peuvent mettre quelques jours à se mettre à jour.
Mon image est-elle envoyée ?
Non. Toutes les icônes sont générées dans votre navigateur et ne quittent jamais votre appareil.