Générateur de Favicon

Importez une image carrée et téléchargez toutes les tailles de favicon nécessaires, avec les balises HTML link prêtes à coller dans votre page.

Déposez une image carrée (PNG, JPG) ou cliquez pour choisir

Ou générez-la à partir d'un texte :

Fond

Texte

Fonctionnalités

Toutes les tailles standard

Code de la balise link

Extrait de manifest.json

Téléchargement en archive zip

Comment Utiliser

1. Déposez une image carrée (PNG/JPG) dans la zone d'import.

2. Prévisualisez toutes les tailles générées.

3. Cliquez sur Télécharger pour les récupérer en ZIP, et copiez l'extrait HTML.

À propos de cet outil

Un favicon apparaît dans les onglets du navigateur, les favoris, l'historique, les raccourcis d'écran d'accueil et les résultats de recherche, et chaque emplacement réclame une taille différente. Ce générateur prend une image carrée — ou un ou deux caractères sur un fond coloré — et la dessine en 16, 32, 48, 64, 128, 180, 192, 256 et 512 pixels, avec un bouton de téléchargement pour chaque PNG. C'est aux petites tailles que les favicons échouent : les détails fins et le texte mince disparaissent en 16 × 16, les formes franches et le contraste élevé fonctionnent donc le mieux. Partez d'une source carrée d'au moins 512 × 512 pixels pour que les grandes tailles restent nettes. Après le téléchargement, référencez les fichiers avec des balises link dans le head de votre page et, pour les applications web installables, déclarez les tailles 192 et 512 dans le manifeste.

Questions Fréquentes

De quelles tailles de favicon ai-je réellement besoin ?

Pour la plupart des sites : 32 × 32 pour les onglets du navigateur (16 × 16 en solution de repli pour les anciens navigateurs), 180 × 180 pour les icônes tactiles Apple, et 192 × 192 plus 512 × 512 pour Android et les manifestes d'application web. 48 × 48 est un bon complément, car la recherche Google peut afficher des favicons basés sur des multiples de 48px.

Quel HTML dois-je ajouter à ma page ?

Un ensemble typique comprend <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">, <link rel="apple-touch-icon" href="/favicon-180x180.png"> et un manifeste listant les icônes 192 et 512. Placez-les dans le <head> de chaque page.

Crée-t-il un fichier .ico ?

Non. Il exporte des fichiers PNG, que tous les navigateurs actuels acceptent pour rel="icon". Si vous avez besoin d'un favicon.ico multi-tailles pour de très anciens navigateurs ou certaines fonctions de Windows, assemblez les PNG 16, 32 et 48 avec un outil ICO dédié.

Pourquoi mon favicon est-il flou ou illisible à 16 pixels ?

Les détails qui fonctionnent à 512px se perdent à 16px. Utilisez un symbole simplifié, des traits plus épais et un fort contraste, ou l'option texte avec une seule lettre en gras, qui reste lisible en petit.

Pourquoi mon nouveau favicon ne s'affiche-t-il pas ?

Les navigateurs mettent les favicons en cache de façon tenace. Videz le cache ou ouvrez le site dans une fenêtre de navigation privée, et renommez le fichier ou ajoutez un paramètre de version comme ?v=2 lors du remplacement. Les moteurs de recherche peuvent mettre des jours, voire des semaines, à le rafraîchir.