Générateur de favicon

Créez un favicon à partir de lettres, d'un emoji ou d'une image : favicon.ico multi-tailles, PNG de 16 à 512 px, icône Apple touch, manifest web et balises HTML link.

Source

Jusqu’à 3 caractères, p. ex. « A », « AK » ou « 🚀 ».

Qu'est-ce que Générateur de favicon ?

Générez un jeu complet de favicons pour votre site à partir de lettres ou d'un emoji (avec vos couleurs et votre forme) ou d'une image. Vous obtenez un favicon.ico multi-tailles (16, 32 et 48 px), des icônes PNG en 16, 32, 48, 180 (icône tactile Apple), 192 et 512 px, un site.webmanifest et les balises HTML <link> à coller dans votre <head>.

Comment utiliser Générateur de favicon

  1. Choisissez la Source : Texte ou emoji, ou Image (une image carrée convient le mieux).
  2. Définissez la Forme, l'Arrière-plan et la Couleur du texte, ainsi que le Nom de l’application (pour le manifest).
  3. Cliquez sur Télécharger favicon.ico et téléchargez les PNG dont vous avez besoin depuis les aperçus.
  4. Copiez le HTML pour le <head> et le site.webmanifest, et placez tous les fichiers à la racine de votre site.

Exemple

Entrée
Text "A", Rounded, Background #4f46e5
Sortie
<link rel="icon" href="/favicon.ico" sizes="48x48">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">

Plus favicon.ico (16, 32, 48 px) et six fichiers PNG.

Quand utiliser Générateur de favicon

Utilisez-le pour de nouveaux sites web, projets personnels, outils internes et sites de documentation. Si vous avez un logo détaillé, concevez des versions simplifiées pour 16 et 32 px, car les détails fins disparaissent à ces tailles. Ajoutez aussi un favicon SVG si vous voulez une icône nette qui s'adapte au mode sombre.

Comment fonctionne Générateur de favicon

Chaque taille est dessinée sur un canvas distinct : la forme est remplie avec la couleur d'arrière-plan et jusqu'à trois caractères sont centrés et mis à l'échelle selon la taille de l'icône, ou l'image est recadrée au centre en carré et redimensionnée avec un lissage de haute qualité. Chaque canvas est exporté en PNG. Le fichier .ico est assemblé octet par octet : un en-tête ICONDIR de 6 octets, une entrée de répertoire de 16 octets par taille (largeur, hauteur, 32 bpp, taille des données et décalage) et les images PNG intégrées à la suite — le format PNG-dans-ICO pris en charge par tous les navigateurs actuels et par Windows Vista et suivants. L'icône tactile Apple de 180 px est toujours carrée et opaque, car iOS arrondit lui-même les coins.

Cas d'utilisation courants

  • Créer en quelques secondes un favicon lettre ou emoji pour un projet personnel
  • Générer toutes les tailles d'icônes à partir d'un logo carré
  • Ajouter une icône tactile Apple et un manifest web pour l'installation sur l'écran d'accueil
  • Produire un vrai favicon.ico multi-tailles pour les navigateurs anciens

Questions Fréquentes

Ai-je encore besoin de favicon.ico ?

Les navigateurs demandent automatiquement /favicon.ico, et certains outils et lecteurs RSS ne regardent que là : il vaut donc toujours la peine de le fournir en plus des icônes PNG.

Pourquoi mon favicon ne se met-il pas à jour ?

Les navigateurs mettent les favicons en cache de façon agressive. Faites une actualisation forcée, ouvrez directement l'URL de l'icône ou ajoutez une chaîne de version aux balises link.

Mon image est-elle téléversée ?

Non. Toutes les icônes et le fichier .ico sont créés dans votre navigateur.

Explorer d'autres catégories