Générateur de favicon
Transformez une image en toutes les tailles de favicon utiles à un site moderne : 16, 32, 48, 180, 192 et 512 px, avec les balises link correspondantes. Tout se passe dans le navigateur.
Déposez un logo et cet outil le dessine dans les six tailles d'icône qu'un site actuel référence réellement — 16, 32 et 48 pour l'onglet du navigateur et le résultat Google, 180 pour l'icône tactile d'Apple, 192 et 512 pour le manifeste d'application web — puis vous remet le balisage <head> et les entrées de manifeste qui vont avec. Tout est rendu sur un canvas dans votre propre navigateur : l'image n'est jamais envoyée, et vous pouvez aplatir la transparence sur un fond ou aérer la marque avant l'export.
À quoi sert un jeu de favicons
Un favicon est la petite image affichée par le navigateur dans l'onglet, les favoris et l'historique ; Google en montre également une à côté de votre résultat sur mobile. Un seul fichier ne suffit plus, car la même marque apparaît aujourd'hui à 16 px dans un onglet et à 512 px sur un écran d'accueil Android : une image unique mise à l'échelle par le navigateur paraît brouillonne d'un côté ou surdimensionnée de l'autre. Cet outil rend chaque taille séparément depuis votre source, si bien que chaque icône bénéficie de sa propre réduction propre, et produit du PNG partout — le format accepté par tous les navigateurs actuels.
Comment fonctionne le générateur de favicon
Votre image est décodée une seule fois, puis dessinée séparément sur un canvas pour chaque taille cible : 16, 32, 48, 180, 192 et 512 pixels. Chaque icône est donc une réduction de l'original et non un rééchantillonnage d'une copie déjà rétrécie — c'est précisément ce qui évite que les petites tailles deviennent pâteuses. Le tracé conserve les proportions et centre le résultat : un logotype large est encadré de bandes plutôt qu'écrasé, et une marge facultative donne de l'air aux marques qui touchent le bord. Chaque canvas est encodé en PNG : sans perte, avec canal alpha, lu par tous les navigateurs actuels. Les consignes de Google demandent une icône carrée multiple de 48, d'où la présence du 48 et du 192 dans le jeu.
Fonctionnalités
Comment générer vos icônes
Sélectionnez une image source — carrée et d'au moins 512 × 512 pour le rendu le plus net.
Choisissez de conserver la transparence ou de l'aplatir sur du blanc ou du noir.
Ajoutez une marge intérieure si votre marque touche le bord et manque d'air.
Lancez l'outil, téléchargez chaque taille et collez le balisage dans votre <head>.
Erreurs fréquentes
Exemples
Voir aussi
- Redimensionneur d'images — Votre source n'est pas carrée ? Redimensionnez ou recadrez-la en carré avant de générer le jeu.
- Convertisseur de format d'image — Vous partez d'un logo JPEG ? Convertissez-le d'abord en PNG pour garder des bords nets.
FAQ
Ai-je encore besoin d'un fichier favicon.ico ?
Uniquement si vous prenez encore en charge Internet Explorer. Tous les navigateurs sortis ces dix dernières années lisent les favicons PNG déclarés par une balise link, d'où le PNG en sortie de cet outil. Conserver un favicon.ico à la racine reste sans danger si vous en avez déjà un, car les navigateurs demandent ce chemin par défaut en l'absence de balise link.
Pourquoi six tailles plutôt qu'une ?
Parce que la même marque est affichée à des échelles très différentes. 16 et 32 px vont dans l'onglet, 48 px est la taille que l'indexeur de Google privilégie pour l'icône de votre résultat mobile, 180 px est ce qu'utilise iOS quand quelqu'un ajoute votre site à son écran d'accueil, et 192 et 512 px sont les tailles visées par un manifeste d'application web. Rendre chacune depuis la source les garde toutes nettes.
Mon logo est-il envoyé sur un serveur ?
Non. L'image est lue par votre navigateur, dessinée sur un canvas et exportée dans la page elle-même. Rien ne traverse le réseau : un logo non encore publié reste sur votre machine.
Quelle taille doit faire mon image source ?
Carrée et d'au moins 512 × 512. Ainsi la plus grande icône est une copie directe et toutes les autres sont des réductions, le sens qui préserve le détail. Si votre source est plus petite, l'outil fonctionne quand même mais vous indique quelles tailles ont dû être agrandies.