Générateur de favicon

Créez un favicon en ligne depuis une image ou un logo, avec favicon.ico, PNG multi-tailles et icône Apple Touch.

◴ Aucune donnée stockée ⌁ Gratuit

Concept

Le favicon est l’icône d’identité pour l’onglet, les favoris et la PWA

Un favicon n’est pas seulement une image de prévisualisation; il couvre aussi l’intégration tab, marque-pages et écran d’accueil PWA.

Les tailles tab classiques sont 16~48px, tandis que bookmark et PWA utilisent souvent 180/192/512px PNG.

Validez les contrastes en mode sombre avec un fond transparent et testez l’affichage réel sur onglet, favori et écran d’installation.

Quand l’utiliser

Préparez favicon.ico, site.webmanifest et les liens rel="icon"/"apple-touch-icon" ensemble pour les cas tab/bookmark/PWA.

Tailles recommandées

Générez des PNG 16/32/48/180/192/512px, favicon.ico, et SVG selon la couverture browser/mobile.

Contrôles finaux

Vérifiez transparence, contraste dark mode, base path dans href et l’affichage réel sur tab, bookmark et écran d’installation.

Le résultat attendu n’est pas seulement une miniature; vérifiez que manifest et liens HTML sont reliés et affichés correctement dans l’UI navigateur.

Générateur de favicon Espace de génération de favicon

Image source
Résultat favicon
Les aperçus des favicons générés apparaîtront ici.

Mode d’emploi

  1. 1 Sélectionnez ou déposez une image proche d'un format carré.
  2. 2 Cliquez sur générer pour créer un favicon.ico et plusieurs tailles PNG de favicon.
  3. 3 Téléchargez les fichiers séparément ou en ZIP, puis vérifiez les chemins relatifs ou le chemin de base dans le code HTML selon votre déploiement.

Cas d’usage courants

  • Générer un favicon PNG/ICO
  • Créer un favicon à partir d'un logo
  • Créer une icône Apple Touch
  • Préparer le code HTML de lien favicon

Questions fréquentes

Comment créer un favicon ICO et PNG ?

Importez un logo ou une image carrée, puis lancez le générateur de favicon. La V2 crée des tailles PNG, favicon.ico et le code HTML de lien, avec un téléchargement ZIP pour l'ensemble complet. L'exemple HTML utilise des chemins relatifs par défaut : ajoutez un chemin de base avant chaque href si vous déployez sous un sous-chemin. La génération dans le navigateur est le mode par défaut, tandis que la génération optimisée serveur utilise le redimensionnement Cloud Run.

Flux de travail associé