Tu as un logo, et ton site a besoin d'un favicon : cette minuscule image dans l'onglet du navigateur. Facile, jusqu'à ce que tu découvres que les navigateurs, l'iPhone, les téléphones Android et Windows veulent chacun leur propre taille et leur propre fichier. Le générateur de favicon GetPlugzz fait tout ça à partir d'une seule image. Tu déposes ton logo, tu appuies sur un bouton, et tu obtiens favicon.ico, une icône Apple, des icônes Android, une tuile Windows, un fichier manifest et le code à coller dans ton site. Il tourne dans ton navigateur : pas de compte, pas de filigrane, et rien n'est envoyé.
Comment créer un favicon dans toutes les tailles à partir d'une seule image ?
Ouvre le générateur de favicon et fais ceci :
- Ajoute une image. Dépose ton logo dans la zone ou clique pour en choisir un. Une image carrée d'au moins 512 × 512 pixels donne les meilleurs résultats. Toute autre image est recadrée en carré depuis le centre.
- Vérifie l'aperçu. Si ton image a un fond transparent, il est conservé, ce qui est parfait pour les logos. Tu verras toutes les tailles qui seront créées.
- Télécharge. Appuie sur Tout télécharger (ZIP) pour obtenir toutes les tailles, puis colle le code affiché dans le head de ton site. Il y a un bouton Copier pour le code.
Rien à redimensionner à la main et rien à installer. Si ton navigateur bloque le téléchargement, clique sur Autoriser près de la barre d'adresse et ça passe.
Pourquoi un favicon a-t-il besoin d'autant de tailles ?
Pense à un photomaton qui imprime la même image en minuscule autocollant, en photo d'identité et en affiche. C'est le même visage, mais chaque endroit a son propre cadre. Un favicon fonctionne pareil. Ton logo apparaît à différents endroits, et chacun réclame une taille différente :
- 16 × 16 et 32 × 32 : l'onglet du navigateur. Celle en 32 garde la netteté sur les écrans haute résolution (retina).
- 48 × 48 : les raccourcis Windows.
- 150 × 150 : la tuile Windows.
- 180 × 180 : l'icône Apple touch, que les iPhone et iPad utilisent quand quelqu'un ajoute ton site à l'écran d'accueil.
- 192 × 192 et 512 × 512 : Android, pour l'écran d'accueil et l'écran de démarrage (aussi utilisées pour les applications web).
Que contient le fichier ZIP ?
L'outil crée tout ça pour toi et l'emballe dans un seul fichier :
- favicon.ico : l'icône classique des onglets. C'est un vrai fichier multi-tailles, avec les versions 16, 32 et 48 à l'intérieur.
- favicon-16x16.png, favicon-32x32.png et favicon-48x48.png : les petites tailles.
- apple-touch-icon.png : l'icône pour iPhone et iPad.
- android-chrome-192x192.png et android-chrome-512x512.png : les icônes pour Android.
- mstile-150x150.png : la tuile Windows.
- site.webmanifest : dit aux navigateurs quelles icônes utiliser.
- head-snippet.html : le code à coller, enregistré en fichier.
Où vont les fichiers ?
Envoie les fichiers dans le dossier principal de ton site, puis colle le code de l'outil dans le head de tes pages. C'est ce code qui dit au navigateur où trouver chaque icône. Deux petits conseils : ouvre site.webmanifest et ajoute le nom de ton site, car il est laissé vide, et change la couleur du thème si tu veux autre chose que du blanc.
Pas encore de site sur lequel les envoyer ? Notre guide pour lancer votre premier site web couvre le domaine, l'hébergement et les pages. Si vous préférez ne pas partir d'une page blanche, un AI website builder (lien sponsorisé) de Bluehost inclut l'hébergement, vous auriez donc où déposer les fichiers.
Quelle image fonctionne le mieux ?
- Carrée et grande. Commence avec au moins 512 × 512 pixels. L'outil la réduit à toutes les tailles, donc tu n'as jamais rien à redimensionner toi-même.
- Centrée. Une image qui n'est pas carrée est recadrée en carré depuis le centre, donc garde l'essentiel au milieu.
- Le transparent, c'est bon. Si ton logo a un fond transparent, les icônes le gardent.
- Le simple gagne. À 16 pixels, il y a très peu de place, donc une forme marquée ou une seule lettre se lit mieux qu'un dessin détaillé.
Une chose à savoir : une image à la fois
Le générateur crée toutes les tailles à partir d'une image d'un coup. Il ne traite pas plusieurs logos différents en une fois. Si tu as un autre site, appuie sur Choisir une autre image et recommence, ce qui prend quelques secondes.
Bon à savoir avant de commencer
- Une image qui n'est pas carrée est recadrée depuis le centre. Utilisez une image carrée pour que rien ne soit coupé.
- Donnez à l'icône Apple un fond uni : les iPhone remplissent les zones transparentes de noir.
- À 16×16 pixels, les détails fins disparaissent, une forme simple fonctionne donc mieux.
- Les navigateurs et Google gardent les anciens favicons un moment ; un nouveau peut mettre des jours à apparaître.
- Renseignez le nom de votre site dans site.webmanifest et envoyez tous les fichiers dans le dossier principal de votre site.
Questions fréquentes
Oui. Il n'y a ni compte, ni filigrane.
Non. Les icônes sont créées dans ton navigateur et ton image ne quitte jamais ton appareil.
Commence avec une image carrée d'au moins 512 × 512 pixels. L'outil la réduit à toutes les tailles dont tu as besoin, donc tu n'as rien à redimensionner toi-même.
Oui. Si ton logo a un fond transparent, il reste transparent dans les icônes.
Envoie-les dans le dossier principal de ton site, puis colle le code de l'outil dans le head de tes pages.
Générateur de Favicon gratuit — toutes les tailles, une seule image
Une image en entrée, toutes les tailles d'icône en sortie : ico, Apple, Android, Windows et le code à coller. Créé par GetPlugzz, fait entièrement dans ton navigateur.
