Un jeu de favicons digne de ce nom ne se limite pas à un seul fichier : les navigateurs veulent un .ico multi-tailles, iOS veut un apple-touch-icon de 180 px, Android veut des PNG de 192 et 512 px plus un manifeste web. Cet outil génère tout cela à partir d'une seule image et l'emballe dans un ZIP, accompagné des balises HTML exactes à coller dans votre <head>.
L'aperçu affiche votre icône aux vraies tailles de 16, 32 et 48 px, pour vérifier qu'elle reste reconnaissable en tout petit avant de la publier.
Comment faire
- Ajoutez votre logoLes images carrées conviennent le mieux ; les autres sont recadrées au centre.
- Vérifiez les petites taillesL'aperçu à 16 px est ce que la plupart des utilisateurs verront réellement dans un onglet.
- Téléchargez le ZIPfavicon.ico, six PNG, site.webmanifest et un html-snippet.txt prêt à coller.
Une image en entrée, un jeu de favicons complet en sortie
Déposez un seul logo ou une icône et ce générateur construit l'ensemble complet dont un site moderne a besoin : un favicon.ico multi-tailles regroupant les versions 16, 32 et 48 pixels, des PNG isolés en 16, 32, 48, 180 pour l'icône Apple touch, et 192 et 512 pour les installations Android et PWA, plus un site.webmanifest. Tout arrive dans un seul ZIP à déposer directement à la racine de votre projet.
Vous obtenez aussi un extrait HTML prêt à coller pour le head, avec les bonnes balises link et meta déjà branchées. Copiez-le dans votre gabarit, mettez les fichiers en ligne, et le favicon apparaît dans les onglets du navigateur, les favoris et les raccourcis d'écran d'accueil sans écrire le moindre balisage à la main.
Des icônes nettes à chaque taille
Les favicons sont impitoyablement petits : le générateur rend donc des aperçus à taille réelle en 16, 32 et 48 pixels, exactement comme un onglet de navigateur les affichera. Vous repérez ainsi un logo qui devient illisible en 16px avant de l'expédier. Si votre image source n'est pas carrée, l'outil la recadre au centre pour que l'icône reste équilibrée au lieu d'être écrasée.
Tout le processus tourne dans le navigateur à partir de votre image d'origine, ce qui veut dire que vous pouvez générer des PNG de favicon et un ICO depuis un logo haute résolution sans aucune mise en ligne ni compte.
À quoi les gens l'utilisent
Lancer un nouveau site — Générez favicon.ico et chaque taille de PNG en une passe pour que les onglets et les favoris soient soignés dès le premier jour.
Ajouter une icône d'installation PWA — Exportez les PNG 192 et 512 plus un site.webmanifest pour que votre appli s'installe avec une véritable icône d'écran d'accueil.
Icône Apple touch — Produisez l'apple-touch-icon en 180x180 pour que les favoris et écrans d'accueil iOS affichent une tuile nette.
Refondre un site existant — Passez un seul nouveau logo dans le générateur et remplacez tout le jeu d'icônes d'un coup.
Remise au client — Remettez un unique ZIP d'ico, de PNG, de manifest et de l'extrait head pour que le développeur n'ait qu'à le déposer.
Vérifier la lisibilité en petit — Utilisez l'aperçu à taille réelle en 16px pour confirmer qu'un logo détaillé se lit encore comme une icône.
Logo non carré — Fournissez un logotype large et laissez le recadrage centré en faire un favicon carré et équilibré.
Site statique ou projet framework — Copiez les balises head générées dans votre gabarit Next, Astro ou HTML pur, et expédiez.
Générez un jeu complet de favicons à partir d'une seule image — dans le navigateur, en une passe
Un favicon a l'air d'une simple pensée après-coup de 16×16 pixels, et pendant des années il l'a été. Les navigateurs et plateformes modernes en ont discrètement fait une petite production. Pour le faire correctement aujourd'hui, il vous faut un favicon.ico, un éventail de PNG de 16 px jusqu'à 512 px, une icône Apple touch pour les écrans d'accueil iOS, un site.webmanifest pour que le site puisse s'installer comme une application, et le bon bloc de balises <link> et <meta> dans le <head> de votre HTML. Ratez une taille et votre icône d'onglet paraît floue sur un écran retina ; ratez le manifest et l'icône « ajouter à l'écran d'accueil » se rabat sur une capture d'écran ; ratez le bloc de balises et certaines plateformes ignorent l'ensemble.
C'est beaucoup de sorties délicates pour une tâche qu'on fait une fois par projet avant d'en oublier les détails. IMG.DIY prend une seule image source et produit le jeu complet — le .ico, chaque taille de PNG, le web manifest et un extrait HTML à copier-coller — en redimensionnant entièrement dans votre navigateur avec Canvas. Votre logo est lu localement et rendu à chaque taille cible sur l'appareil ; rien n'est téléversé. Pour une marque ou le logo d'un produit non lancé que vous préféreriez ne pas publier sur un serveur tiers avant le lancement, cette garantie locale vaut le coup, et elle ne coûte rien.
Parce que toute la chaîne s'exécute côté client, elle fonctionne aussi hors ligne une fois la PWA en cache : vous pouvez régénérer des icônes sur une machine de travail verrouillée ou sans connexion. Gratuit, sans compte, sans filigrane gravé dans vos icônes.
Ce qui fait la différence
- Le jeu complet, pas juste un .ico. ICO, PNG de 16 à 512, icône Apple touch et
site.webmanifesten un seul téléchargement. - Le HTML à copier-coller inclus. Le bloc
<link>/<meta>exact à déposer dans votre<head>, pour que les icônes s'enregistrent réellement sur tous les navigateurs. - Rien de téléversé. Votre logo est redimensionné localement — utile quand la marque est confidentielle ou avant lancement.
- Une passe, pas d'assistant. Fournissez une image, obtenez tout ; aucun flux multi-étapes qui vous demande des choix de plateforme à aller ensuite rechercher.
- Hors ligne et net. PWA en cache, sans inscription, sans filigrane sur aucune icône générée.
IMG.DIY face aux autres générateurs de favicons
| Aspect | favicon.io | realfavicongenerator.net | Manuel (application de design + code) | IMG.DIY |
|---|---|---|---|---|
| Fichiers téléversés | Oui, vers leur serveur | Oui, vers leur serveur | Non, local | Non, reste dans le navigateur |
| Jeu complet (.ico + PNG + manifest) | Oui | Oui, très complet | Vous l'assemblez | Oui |
| Extrait HTML fourni | Oui | Oui, détaillé | Vous l'écrivez | Oui |
| Étapes jusqu'au résultat | Peu | Plus (nombreuses options) | Nombreuses | Une passe |
| Fonctionne hors ligne | Non | Non | Oui | Oui, après la première visite |
| Prix | Gratuit | Offre gratuite ; options payantes | Coût de l'application + votre temps | Gratuit |
| Compte requis | Non | Non | Non | Non |
Soyons francs sur la concurrence : realfavicongenerator est excellent et vraiment plus complet — il prévisualise votre icône sur de vraies plateformes, gère des cas limites comme les masques d'onglet épinglé de Safari et le thème, et vous laisse ajuster l'apparence par plateforme. Si vous voulez ce niveau de contrôle et que le téléversement de votre image ne vous dérange pas, c'est un très bon choix. favicon.io est rapide et simple et produit lui aussi un jeu solide. La différence d'IMG.DIY, c'est la combinaison de sortie complète, sans envoi et en une passe : vous obtenez les mêmes livrables pratiques — ico, PNG, manifest et le HTML pour les raccorder — sans que votre logo ne quitte le navigateur et sans dérouler un assistant de configuration. Pour « j'ai un logo, donne-moi tout ce qu'il faut coller, et n'envoie mon fichier nulle part », c'est le bon choix.
Pourquoi IMG.DIY
Jeu complet
ICO + PNG 16/32/48/180/192/512 + manifeste.
HTML à copier-coller
Les balises link exactes fournies dans un fichier texte.
Aperçu à taille réelle
Voyez l'icône aux vrais 16/32/48 px d'abord.
Confidentiel
Votre logo ne quitte jamais le navigateur.