Design

Générateur de Favicon

Importez une image PNG, JPG, SVG ou WebP et générez des favicons dans toutes les tailles standard (16×16 à 512×512). Traitement entièrement local — votre image n'est jamais envoyée au serveur.

[[ labels.upload_title ]]

[[ labels.upload_hint ]]

[[ labels.upload_formats ]]

[[ labels.drop_active ]]
preview
[[ imageFile?.name ]]

[[ labels.result_title ]]

[[ g.def.size ]]×[[ g.def.size ]]
[[ sizeLabel(g.def) ]]
[[ g.def.filename ]]

[[ labels.html_title ]]

[[ labels.html_desc ]]

[[ htmlSnippet ]]

Conseils

  • L'image importée n'est jamais envoyée à un serveur. Tout le traitement s'effectue directement dans votre navigateur.
  • Image recommandée : Utilisez un PNG carré (minimum 512×512 px) pour un redimensionnement net dans toutes les tailles. La transparence (canal alpha) est entièrement prise en charge.
  • Les favicons SVG peuvent être utilisés directement via <link rel="icon" type="image/svg+xml"> dans certains navigateurs modernes. Cependant, iOS Safari nécessite un Apple Touch Icon au format PNG.
  • Si vous développez une PWA (Progressive Web App), enregistrez les icônes PNG de 192×192 et 512×512 dans votre fichier manifest.json.

Questions fréquentes

Cet outil génère des fichiers au format PNG. Tous les navigateurs modernes (Chrome, Firefox, Edge, Safari) prennent en charge les favicons PNG, donc le format ICO n'est pas nécessaire en pratique. L'ICO n'est requis que pour supporter IE11 et les versions antérieures, ce qui est une exigence très rare aujourd'hui.

Nous recommandons a minima 32×32 (onglet du navigateur) et 180×180 (Apple Touch Icon / écran d'accueil iOS). Si vous créez une PWA, vous avez également besoin du 192×192 et du 512×512.

La version actuelle redimensionne l'image pour qu'elle s'adapte à un canevas carré tout en conservant ses proportions. Si votre image contient un logo ou du texte, nous vous conseillons de la recadrer en carré au préalable pour un meilleur résultat.

Anecdote — L'histoire du favicon — Une petite révolution en 16px

En 1999, Internet Explorer 5 fut le premier navigateur à afficher de petites icônes à côté des favoris. Cela introduisit la convention de placer un fichier nommé favicon.ico à la racine du site. Le mot « favicon » est la contraction de « favorite icon ».

Le format ICO fut emprunté aux fichiers d'icônes de Windows et pouvait contenir plusieurs tailles (16×16, 32×32, 48×48) dans un seul fichier. Aujourd'hui, PNG et SVG sont des alternatives viables. Les favicons SVG (image/svg+xml) se distinguent par leur indépendance vis-à-vis de la résolution et leur compatibilité avec le mode sombre. La balise <link rel="icon"> a été formellement standardisée au milieu des années 2000, mais placer favicon.ico à la racine persiste comme convention de rétrocompatibilité.

Lors du lancement de l'iPhone en 2007, Apple introduisit sa propre spécification d'Apple Touch Icon (apple-touch-icon.png) — l'icône affichée lorsqu'un utilisateur ajoute un raccourci à son écran d'accueil iOS. Initialement de 57×57 px, elle a évolué vers le standard actuel de 180×180 px avec la généralisation des écrans Retina. L'essor des PWA a ajouté les tailles 192×192 et 512×512 à la liste, rendant la gestion des favicons de plus en plus complexe au fil des ans.

Plus d'outils dans cette catégorie