Skip to content

Générateur de Favicon

Une image carrée en entrée, un jeu de favicons complet en sortie. Rien ne quitte votre navigateur.

En 2026, une configuration de favicon moderne est un petit ensemble de fichiers, pas un seul : un favicon.ico classique pour les anciens navigateurs et les vieux favoris, des icônes PNG à 16 et 32 pixels pour les onglets, une apple-touch-icon de 180 px pour les écrans d’accueil iOS, et des PNG de 192 et 512 px pour le manifeste d’application web. La partie .ico est moins pénible qu’il n’y paraît : depuis Windows Vista, les entrées du répertoire ICO peuvent contenir directement des images encodées en PNG. Cet outil rend donc votre image à chaque taille sur un canvas, encode chacune en PNG et enveloppe le trio 16/32/48 dans un conteneur ICO qui ne coûte qu’un en-tête de 6 octets plus 16 octets de répertoire par image — le tout côté client, sans que rien ne soit envoyé nulle part.

Drop one image here (PNG, SVG, JPEG, WebP…), or

One file, up to 16 MB. A square 512×512+ source works best. Stays in your browser — nothing is uploaded.

How to use

  1. Déposez une image

    Glissez n'importe quelle image que votre navigateur sait décoder — PNG, SVG, JPEG, WebP — sur la zone de dépôt. Une source carrée d'au moins 512 × 512 donne les résultats les plus nets ; les images non carrées sont recadrées automatiquement au centre.

  2. Vérifiez les aperçus aux petites tailles

    L'outil rend votre icône à 16, 32 et 48 pixels sur un fond à damier clair et sombre — exactement les tailles utilisées par les onglets de navigateur. Si le dessin devient illisible à 16 px, simplifiez-le avant de le publier.

  3. Téléchargez le jeu complet

    Récupérez favicon.ico (qui regroupe les entrées PNG 16, 32 et 48 px dans un seul fichier) ainsi que les PNG individuels : favicon-16x16.png, favicon-32x32.png, apple-touch-icon.png à 180 px, et icon-192/icon-512 pour votre manifeste.

  4. Copiez les balises head

    Copiez le snippet <link> prêt à l'emploi dans le head de votre HTML, placez les fichiers à la racine de votre site et référencez icon-192.png et icon-512.png dans le tableau icons de votre manifeste d'application web.

Frequently asked questions

Mon image est-elle envoyée sur un serveur ?
Non. Le décodage, le recadrage centré, le redimensionnement, l'encodage PNG et l'assemblage du conteneur ICO s'exécutent tous dans votre navigateur avec l'API Canvas et du JavaScript pur. Aucune requête d'upload n'a lieu à aucun moment — Convertitive ne voit jamais votre image.
Quelles tailles comptent vraiment, et pourquoi celles-ci ?
16 × 16 et 32 × 32 couvrent les onglets de navigateur, les barres de favoris et les listes d'historique sur écrans standard et haute densité. 48 × 48 couvre les raccourcis de site Windows et certains contextes de bureau. 180 × 180 est la taille demandée par les iPhone et iPad actuels pour les icônes d'écran d'accueil. 192 × 192 et 512 × 512 sont les deux tailles attendues par la spécification du manifeste web et par l'invite d'installation d'Android. Pour tout le reste, les navigateurs redimensionnent à partir de l'une de ces tailles.
Ai-je encore besoin d'un fichier .ico en 2026 ?
Oui, comme filet de sécurité. Les navigateurs et robots antérieurs à la prise en charge des favicons PNG, les vieux favoris qui pointent en dur vers /favicon.ico, et toute une kyrielle de lecteurs de flux, d'outils de prévisualisation de liens et de robots de supervision demandent encore /favicon.ico à la racine du site sans condition. Servir un vrai fichier à cet emplacement ne coûte rien et évite un flot régulier de 404 dans vos journaux.
Les fonds transparents sont-ils préservés ?
Oui. Chaque sortie est encodée en PNG — y compris les entrées à l'intérieur du conteneur .ico — et le PNG gère la transparence alpha complète. Les aperçus à damier ci-dessus existent précisément pour vérifier comment votre icône transparente se comporte sur les thèmes clairs et sombres du navigateur avant de vous décider.
Pourquoi l'icône Apple touch fait-elle 180 pixels ?
180 × 180 est la taille demandée par iOS pour les icônes d'écran d'accueil sur les écrans Retina 3x (60 pt × 3). Les appareils plus anciens qui attendent 152 ou 167 pixels réduisent simplement le fichier de 180 px, donc fournir la seule taille la plus grande couvre toute la gamme Apple. Notez qu'iOS applique lui-même son masque d'angles arrondis : fournissez un carré plein cadre, sans coins pré-arrondis.
Et les favicons SVG ?
Les navigateurs de bureau modernes acceptent <link rel=« icon » type=« image/svg+xml »> et c'est un excellent complément — un seul fichier net à toutes les tailles, capable même de s'adapter au mode sombre avec du CSS embarqué. Mais la prise en charge de Safari a historiquement traîné et de nombreux agents non navigateurs l'ignorent, si bien que le jeu PNG + ICO reste la base sûre. Ajoutez le SVG comme <link> supplémentaire, pas en remplacement.

About

Le conteneur ICO, et pourquoi les entrées PNG fonctionnent

Un fichier .ico est l'un des formats de conteneur les plus simples encore utilisés au quotidien : un en-tête ICONDIR de 6 octets (mot réservé, type 1 pour les icônes, nombre d'entrées), puis une ICONDIRENTRY de 16 octets par image consignant sa largeur et sa hauteur (sur un seul octet, où 0 signifie 256), sa profondeur de bits, sa longueur en octets et son décalage, suivies des données d'image brutes mises bout à bout. À l'origine, ces données devaient être un BMP sans en-tête accompagné d'un masque de transparence AND ; depuis Windows Vista, les données peuvent être un flux PNG complet, que le système détecte grâce à ses octets de signature. C'est ce seul changement qui rend possible un générateur côté client aussi compact : l'encodeur PNG de canvas.toBlob du navigateur fait le travail sur les pixels, et la couche ICO ne représente que 6 + 16 × n octets de comptabilité en petit-boutiste écrits avec un DataView.

Comment les navigateurs choisissent une source de favicon

Quand plusieurs liens d'icônes sont déclarés, les navigateurs choisissent selon le type rel et l'attribut sizes : un onglet sur un écran 2x veut du 32 px, donc un <link rel=« icon » sizes=« 32x32 »> l'emporte sur un 16 px ; si rien de déclaré ne correspond, la plupart des navigateurs se rabattent sur /favicon.ico à la racine du site, même sans aucune balise link. Les appareils Apple ignorent complètement rel=« icon » pour les icônes d'écran d'accueil et cherchent rel=« apple-touch-icon » (avec repli sur /apple-touch-icon.png à la racine). Les applications web installables ne lisent ni l'un ni l'autre : elles prennent les entrées 192 et 512 px dans le tableau icons du manifeste. Cette répartition — balises link pour les onglets, apple-touch-icon pour iOS, manifeste pour les installations — explique pourquoi un jeu complet passe par trois mécanismes de livraison plutôt qu'un seul.

Sources & references

Authoritative references behind the math, constants, and tables on this page. Verified by Buğra Sözeri on the dates shown and re-checked at every deploy.