Favicon Generator
Online favicon generator — text, emoji, image, shapes, ICO + PNG all sizes, complete ZIP with HTML
Texte
Fond
Forme du favicon
Aperçu en temps réel
Aperçu onglet navigateur
Mon Site Web
Icône mobile
Mon App
Télécharger
Favicon : guide complet pour 2024
Le favicon (Favorites Icon) est la petite icône qui s'affiche dans l'onglet du navigateur, les favoris, les résultats de recherche Google et sur l'écran d'accueil mobile. Un favicon bien conçu renforce la reconnaissance de votre marque et améliore l'expérience utilisateur.
Quelles tailles de favicon générer ?
| Fichier | Taille | Usage |
|---|---|---|
favicon.ico | 16×16, 32×32 | Navigateurs, favoris — compatibilité universelle |
favicon-32x32.png | 32×32 | Onglets navigateurs modernes |
favicon-16x16.png | 16×16 | Onglets petits, favoris |
apple-touch-icon.png | 180×180 | iPhone, iPad — écran d'accueil iOS |
android-chrome-192x192.png | 192×192 | Android Chrome, PWA manifest |
android-chrome-512x512.png | 512×512 | Splash screen PWA, Play Store |
og-image.png | 1200×630 | Partage réseaux sociaux (Open Graph) |
Balises HTML minimales pour un favicon moderne
<link rel="icon" type="image/x-icon" href="/favicon.ico"> <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"> <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png"> <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"> <link rel="manifest" href="/site.webmanifest">
Frequently asked questions
The modern recommended strategy is: favicon.ico (16+32px) at the root for universal compatibility, PNGs for modern browsers, apple-touch-icon.png (180×180) for ...
The modern recommended strategy is: favicon.ico (16+32px) at the root for universal compatibility, PNGs for modern browsers, apple-touch-icon.png (180×180) for iOS, and android-chrome-192x192.png + 512x512.png for Android and PWAs. The ICO file remains essential as some tools and RSS readers look for it directly at /favicon.ico.
Place all favicon files at the root of your site (e.g., https://yoursite.com/favicon.ico). The favicon.ico is automatically detected by browsers without any HTM...
Place all favicon files at the root of your site (e.g., https://yoursite.com/favicon.ico). The favicon.ico is automatically detected by browsers without any HTML tag. For other formats, add the <link> tags generated by our tool in the <head> section of your HTML.
Use the 'Import image' tab and drag and drop your SVG file. The tool draws it on canvas and converts it to raster PNG at all necessary sizes. For modern browser...
Use the 'Import image' tab and drag and drop your SVG file. The tool draws it on canvas and converts it to raster PNG at all necessary sizes. For modern browsers that support SVG favicons (Chrome, Firefox), you can also add <link rel="icon" href="/favicon.svg"> directly in addition to the generated PNGs.
The site.webmanifest is a JSON file that describes your Progressive Web App (PWA). It defines the app name, icons (192×192 and 512×512), theme color, and displa...
The site.webmanifest is a JSON file that describes your Progressive Web App (PWA). It defines the app name, icons (192×192 and 512×512), theme color, and display mode. Chrome and Android browsers use it to offer installing your site on the home screen.
Favicons are aggressively cached by browsers. To force a reload, clear the cache (Ctrl+Shift+R or Ctrl+F5), open a private browsing tab, or add a version parame...
Favicons are aggressively cached by browsers. To force a reload, clear the cache (Ctrl+Shift+R or Ctrl+F5), open a private browsing tab, or add a version parameter to the favicon URL: <link rel="icon" href="/favicon.ico?v=2">.
Publicité
Tools in the same category
Popular tools
Trending tools