Comment ajouter un favicon en HTML
Ajouter un favicon à une page HTML simple, c'est une ligne de code — mais la configuration moderne et complète tient en six lignes et couvre iOS, Android, le mode sombre et l'installation PWA.
Vérifiez les favicons de n'importe quel site
Installez l'extension Chrome FetchFavicon pour extraire, prévisualiser et valider les favicons instantanément.
La seule balise que tous les navigateurs respectent est <link rel="icon" href="/favicon.ico">. Placez favicon.ico à la racine de votre site et vous avez couvert 80 % du travail.
Les 20 % restants — apple-touch-icon, variantes PNG, SVG compatible mode sombre et webmanifest — font la différence entre une icône par défaut et une image de marque soignée.
Comment ça marche
- 1
Générer votre package favicon
Utilisez le générateur FetchFavicon — il produit tous les fichiers nécessaires plus le code HTML prêt à coller.
- 2
Placer les fichiers à la racine du site
favicon.ico, apple-touch-icon.png, android-chrome-192/512.png, site.webmanifest.
- 3
Coller le snippet dans <head>
Six balises <link> + une balise <meta name="theme-color">.
Essayez maintenant
Obtenir le snippet HTML
Générateur de FaviconFAQ
Où placer les balises <link> ?+
Dans <head>, n'importe où — l'ordre n'a pas d'importance tant qu'elles apparaissent avant </head>.
Ai-je besoin à la fois du .ico et du PNG ?+
Oui. Le .ico est le fallback universel ; le PNG offre le rendu le plus net sur les écrans haute densité.
Et le mode sombre ?+
Publiez une variante SVG qui intègre une media query prefers-color-scheme dans son bloc <style>.
Outils associés
Générateur de Favicon
Générez un pack complet de favicons (ICO + PNG) pour chaque appareil et navigateur.
Convertisseur PNG en ICO
Convertisseur PNG vers ICO en ligne gratuit pour icônes Windows, applications et favicons de sites web.
Vérificateur de favicon
Vérifiez le favicon de n'importe quel site — tailles, formats et variantes manquantes.