Icon Workshop1Importez votre image
Commencez par un logo net ou un symbole simple. Une image carrée donne les meilleurs résultats.
Une image. Chaque écran.
Générateur de favicons et d’icônes d’application
Petites icônes. Une impression durable.
Convertissez votre image en favicons, icônes d’application et pack d’icônes prêt à l’emploi.
PNG ICO PWA
Créez votre pack d’icônes
Transformez votre image en favicons, icônes de l'application et plus encore.
- 1Importer
- 2Ajuster
- 3Télécharger
Déposez votre image ici
PNG, JPG ou SVG · Jusqu'à 5 Mo
Votre image est traitée dans le navigateur et ne quitte jamais votre appareil.
Ajustez votre icône
Affinez le rendu pour chaque écran.
Voir en contexte(importez une image pour voir votre icône)
Onglet du navigateur
×
https://example.com
Écran d'accueil iOS
Votre icône ici
PWA / Android
Votre icône ici
Comment faire un favicon en 3 étapes
D'une image à un ensemble complet d'icônes.
2Ajuster et prévisualiser
Choisissez l’ajustement, le fond et la marge intérieure. Vérifiez le résultat en petite taille.
3Télécharger et ajouter à votre site
Exportez le pack d’icônes, importez les fichiers sur votre site et ajoutez les liens des icônes au HTML.
Un logo, prêt pour chaque écran
Voir où les fichiers générés sont utilisés.
Favicon du site Web
Mon site×16 × 1632 × 32Les icônes de 16 × 16 et 32 × 32 aident à reconnaître votre site dans les onglets et les favoris.
iPhone & iPad
Mon site180 × 180Utilisez une icône apple-touch de 180 × 180 lorsque votre site est ajouté à l’écran d’accueil.
PWA & Android
Installer l'application192 × 192512 × 512Les images de 192 × 192 et 512 × 512 sont des tailles courantes dans les manifestes d’applications web.
Qu'y a-t-il dans votre pack d'icônes ?
Un ensemble d'icônes prêtes à l'emploi pour toutes les plateformes.
- favicon.ico16 × 16, 32 × 32, 48 × 48, 256 × 256
- apple-touch-icon.png180 × 180
- icon-192.png192 × 192
- icon-512.png512 × 512
- site.webmanifestManifeste de l'application Web
Ajouter des icônes à votre site Web
Placez ces liens dans le <head> de votre HTML.
<link rel="icon" type="image/x-icon" href="/favicon.ico">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">Questions fréquentes
Qu’est-ce qu’un favicon ?
Une petite image qui représente votre site dans les onglets et les favoris du navigateur.
Quel format d’image utiliser ?
PNG convient aux logos transparents. Vous pouvez aussi utiliser JPG, WebP et des fichiers SVG sécurisés.
Puis-je utiliser une image non carrée ?
Oui. Choisissez Ajuster, Recadrer ou Étirer pour créer une icône carrée.
Pourquoi inclure plusieurs tailles d’icône ?
Les navigateurs et les écrans d’accueil utilisent des tailles différentes. Les petites icônes restent nettes dans les onglets ; les grandes conviennent aux raccourcis d’application.