Aller au contenu
EN

Générateur de favicon

Créez le favicon de votre site à partir de lettres, d'un emoji ou de votre logo : favicon.ico, PNG, icône Apple et Android, manifeste et code HTML.

  • Gratuit
  • Sans inscription
  • Aucun fichier envoyé
  • Windows, Mac, Android, iPhone

Chargement de l'outil…

À propos de cet outil

Créez toutes les icônes de votre site en une fois : à partir de lettres ou d'un emoji (police, couleurs, forme carrée, arrondie ou ronde) ou de votre logo. Vous obtenez favicon.ico, favicon.svg, les PNG 16 et 32 px, l'icône Apple 180 px, les icônes Android 192 et 512 px, le fichier site.webmanifest et le code HTML à coller.

Dans quels cas l'utiliser ?

Nouveau site ou blog

Un favicon avec l'initiale du site sur sa couleur principale se crée en une minute et rend l'onglet reconnaissable.

Icône d'application web

Avec le manifeste et les icônes Android, le site peut être ajouté à l'écran d'accueil d'un téléphone comme une application.

Logo existant

Choisissez votre logo : il est recadré au carré avec une marge réglable et décliné à toutes les tailles.

Mode d'emploi

  1. Choisissez des lettres, un emoji ou votre logo.
  2. Réglez les couleurs, la forme et la taille en regardant l'aperçu réel.
  3. Créez les fichiers, téléchargez-les et copiez le code HTML.

Comment ça marche

Chaque taille est dessinée séparément dans un canvas (et non réduite depuis une grande image), ce qui garde les petites icônes nettes. Le texte est centré sur la hauteur réelle des lettres, et réduit s'il dépasse 90 % de la largeur.

Le fichier .ico est assemblé octet par octet : un en-tête, une entrée par taille, puis les images PNG, format accepté par tous les navigateurs. Tout est produit sur votre appareil.

Conseils pour un bon résultat

  • Une ou deux lettres maximum : à 16 px, un mot entier est illisible.
  • Choisissez des couleurs très contrastées, l'icône est minuscule.
  • Vérifiez l'aperçu à 16 px, la taille réelle d'un onglet.
  • Videz le cache du navigateur après avoir changé de favicon : l'ancien reste longtemps affiché.

Problèmes fréquents et solutions

L'ancien favicon s'affiche encore

Les navigateurs gardent le favicon en cache. Rechargez la page avec Ctrl+F5, ou ouvrez-la en navigation privée.

L'emoji s'affiche différemment

Les emoji dépendent du système. Dans les PNG et l'ICO, c'est celui de votre appareil qui est dessiné ; le favicon.svg utilise celui du visiteur.

Le logo est coupé

Il est recadré au carré. Augmentez la marge, ou préparez une version carrée du logo.

Questions fréquentes

Quels fichiers faut-il pour un favicon ?

favicon.ico (16, 32 et 48 px) pour tous les navigateurs, un PNG 32 px, apple-touch-icon.png (180 px) pour l'écran d'accueil de l'iPhone, et deux icônes 192 et 512 px pour Android avec le fichier site.webmanifest. L'outil crée tout.

Où mettre les fichiers ?

À la racine du site (à côté de la page d'accueil), puis ajoutez le code HTML fourni dans la balise head de vos pages.

Pourquoi l'icône Apple n'est-elle pas transparente ?

iOS remplace la transparence par du noir sur l'écran d'accueil : l'icône Apple reçoit toujours votre couleur de fond.

Puis-je utiliser un emoji ?

Oui. En mode texte, un favicon.svg est aussi créé : net à toutes les tailles et très léger.

Recherches associées

Toujours bloqué ?

Posez votre question sur le forum : la catégorie, l'outil, la fiche de votre appareil et le résultat du test seront déjà remplis.