Comment faire une favicon (set d'icônes) pour un site web ?
Générateur de favicon en ligne : le set d'icônes complet d'un site dans un seul ZIP.
Dépose une seule image (idéalement 512×512), et on génère tous les fichiers nécessaires : favicon.ico (3 couches), 7 PNG aux tailles que les navigateurs consomment réellement (16, 32, 48, 150, 180, 192, 512), un manifest.webmanifest, et un snippet HTML prêt à coller pour <head>.
Tourne en local : l'image n'est pas uploadée.
Après dépose sur ton hébergement, tu obtiens un rendu d'icône cohérent sur chaque plateforme : Chrome, Safari, écran d'accueil iPhone, Android, tuile Windows épinglée.
Comment l'utiliser
- Upload une image source carrée : idéalement 512×512 px PNG avec transparence. Logo, icône d'app, monogramme.
- Tape le nom de ton site : il atterrit dans manifest.webmanifest comme titre d'app PWA si un utilisateur ajoute ton site à son écran d'accueil.
- Clique sur « Générer le set » : le générateur construit 8 fichiers PNG/ICO + manifest + snippet HTML.
- Télécharge le ZIP, déballe dans le dossier /public de ton serveur, colle le snippet HTML dans <head>. Fini : la favicon marche sur chaque plateforme.
Ce que tu reçois dans le bundle
Ce qu'il y a dans le ZIP, le bundle contient :
- favicon.ico (3 couches) : Internet Explorer, fallback pour les vieux navigateurs, certains lecteurs RSS.
- favicon-16x16.png et favicon-32x32.png : navigateurs modernes (Chrome, Firefox, Safari) prennent celui qui matche le DPI.
- apple-touch-icon.png (180×180) : iPhone et iPad. Quand un utilisateur ajoute ton site à l'écran d'accueil, ça devient l'icône d'app.
- android-chrome-192x192.png et 512×512 : Android Chrome, écran d'accueil et splash PWA.
- mstile-150x150.png : Windows 10/11 quand un utilisateur épingle ton site au menu Démarrer.
- manifest.webmanifest : manifest PWA-compatible pour « Ajouter à l'écran d'accueil ».
- site.html : snippet prêt à copier pour <head>.