Qu'est-ce que Générateur de favicons ?

Ce générateur de favicon crée toutes les tailles dont votre site a besoin — à partir d'une image importée, d'initiales saisies ou d'un emoji. Choisissez une source et obtenez des fichiers ICO en 16×16, 32×32 et 48×48, un SVG redimensionnable, ainsi que des versions PNG pour les icônes Apple Touch et les écrans d'accueil Android, prêts à intégrer dans votre projet.

Partez d'une image, saisissez une à trois lettres avec une police et une forme, ou choisissez un emoji — l'outil rend ensuite six PNG (16, 32, 48, 180, 192, 512 pixels), un SVG net et un ICO multi-résolutions contenant les trois petites tailles que les onglets Windows attendent encore. Le tout est livré dans un ZIP avec un site.webmanifest et les balises link exactes à coller dans le head. Une source SVG ou PNG carrée donne le meilleur rendu après mise à l'échelle.

Comment utiliser

1. Choisissez une source : importez une image carrée (PNG, JPG ou SVG, idéalement 512×512 ou plus), saisissez des initiales avec une police et une forme, ou choisissez un emoji.
2. Prévisualisez les favicons générés dans toutes les tailles standard (16px, 32px, 48px, 180px, 192px, 512px).
3. Téléchargez le pack complet de favicons sous forme de fichier ZIP, comprenant le fichier ICO, toutes les tailles PNG et les balises HTML link à coller dans l'en-tête de votre page.

Quand l'utiliser

• Ajouter les icônes d'onglet et d'écran d'accueil à un nouveau site ou à une web app.
• Rafraîchir l'identité de marque sur un site existant après une refonte du logo.
• Générer des icônes PWA conformes à la spec du manifest pour l'option Ajouter à l'écran d'accueil.

Résultat

Un développeur importe le logo 1024×1024 de sa startup. L'outil génère un jeu complet de favicons comprenant favicon.ico (16/32/48), apple-touch-icon.png (180×180) et les icônes Android (192/512), ainsi que les balises meta HTML.

FAQ

Pourquoi a-t-on besoin d'autant de tailles de favicon ?

Chaque plateforme réclame une taille précise. Les onglets de Chrome utilisent 32 pixels, les favoris 16, les écrans d'accueil iOS 180, ceux d'Android 192, et les splash PWA 512. En livrant toutes les tailles, l'icône reste nette partout.

Faut-il uploader un PNG, un SVG ou un JPG ?

Le SVG est idéal car il se redimensionne sans perte vers toutes les tailles. Un PNG 512 par 512 est le second meilleur choix. Le JPG fonctionne, mais la compression avec perte peut laisser des halos autour de l'icône, surtout en 16 et 32 pixels.

Que contient le fichier ICO ?

ICO est un format conteneur. Celui que produit cet outil embarque trois couches bitmap (16, 32 et 48 pixels) afin que Windows choisisse automatiquement la plus adaptée selon l'emplacement : barre des tâches, liste de fichiers ou onglet du navigateur.

Où déposer les fichiers dans mon projet ?

Décompressez le paquet à la racine publique du site, à côté d'index.html. Les balises link fournies utilisent des chemins racine (/favicon.ico, /apple-touch-icon.png), donc en HTML pur ou avec Next.js, Astro et Vite, aucune config supplémentaire n'est nécessaire.

J'ai changé de favicon mais le navigateur affiche encore l'ancien. Pourquoi ?

Les navigateurs mettent les favicons en cache de façon très agressive. Faites un rafraîchissement forcé (Ctrl+Maj+R sous Windows, Cmd+Maj+R sous Mac) ou ajoutez une query string à la balise link, comme /favicon.ico?v=2, pour forcer un rechargement. Le cache se vide en général de lui-même en un jour.

Outils similaires