Passer au contenu principal
🔖

Guide des tailles des faviconsToutes les tailles pour tous les navigateurs — Édition 2026

Complete favicon size reference for all browsers, Apple touch icons, PWA manifest icons, and Windows tiles. Get exact pixel dimensions for every context where your favicon appears.

Mise à jour April 1, 2026
13 tailles listées
4 catégories

Toutes les dimensions de favicon

Browser Favicons

Standard Favicon

ICO / PNG

16 × 16 px

Browser address bar and default tabs

Minimum size; most browsers use this for address bar

Générer une favicon

High-DPI Favicon

ICO / PNG

32 × 32 px

Browser tab on high-DPI displays

Used by retina displays and Windows taskbar

Générer une favicon

Windows Site Icon

ICO

48 × 48 px

Windows taskbar shortcut icon

Include in .ico file alongside 16×16 and 32×32

Générer une favicon

SVG Favicon

SVG

Évolutif

Scalable favicon for modern browsers

Supported in Chrome 80+, Firefox 41+, Safari 17+ — scales to any size

Générer une favicon

Apple Touch Icons

Apple Touch Icon (Universal)

PNG

180 × 180 px

iOS / iPadOS home screen bookmark icon

Used by iPhone 6 Plus and newer; Apple scales it down for smaller devices

Générer une favicon

Apple Touch Icon (iPad)

PNG

152 × 152 px

iPad home screen bookmark icon

Générer une favicon

Apple Touch Icon (iPhone @2x)

PNG

120 × 120 px

iPhone home screen bookmark icon

Générer une favicon

PWA Manifest Icons

Android Chrome Icon

PNG

192 × 192 px

Chrome for Android home screen icon

Minimum size required in web app manifest for Android installs

Générer une favicon

PWA Splash / Store Icon

PNG

512 × 512 px

PWA install prompt and splash screen

Required for Chrome PWA installability criteria

Générer une favicon

Maskable Icon

PNG

512 × 512 px

Android adaptive icon (fills the full canvas with safe zone)

Keep key content within the inner 80% safe zone circle

Générer une favicon

Windows / Microsoft Tiles

Windows Pinned Site Icon

PNG

144 × 144 px

IE11 Windows tile

Used for Windows 8/10 pinned sites (legacy, still supported)

Générer une favicon

Windows Small Tile

PNG

70 × 70 px

Windows 10 Start Menu small tile

Générer une favicon

Windows Medium Tile

PNG

150 × 150 px

Windows 10 Start Menu medium tile

Générer une favicon

Conseils pour les favicons

  • 1Use an .ico file containing 16×16, 32×32, and 48×48 versions for maximum browser compatibility
  • 2Always provide a 180×180 Apple Touch Icon — iOS uses it for home screen bookmarks
  • 3Include both 192×192 and 512×512 PNG icons in your web app manifest for PWA support
  • 4Use an SVG favicon for the best Retina quality on modern browsers with a PNG fallback for older ones
  • 5Maskable icons should keep key content within the inner 80% of the image (safe zone)
  • 6Avoid fine details at 16×16 — they disappear at that size; opt for a bold, simple mark
  • 7Use a transparent background for PNG favicons so they adapt to light and dark browser chrome

FAQ sur la taille des favicons

Questions fréquentes concernant la taille, le format et la compatibilité des navigateurs avec les favicons

What size does a favicon need to be?

For modern browsers, you need at minimum: a 32×32 PNG (or .ico containing 16, 32, 48 px), a 180×180 Apple Touch Icon for iOS, and 192×192 and 512×512 PNG icons for PWA manifests. An SVG favicon is a great addition for scalable quality on Retina displays.

What is the difference between favicon.ico and favicon.png?

favicon.ico is a multi-size container format that can hold multiple image sizes (16×16, 32×32, 48×48) in a single file. favicon.png is a single-size PNG file. Modern browsers support both, but an .ico file with multiple sizes provides the best compatibility across all browsers and contexts.

What is a maskable icon and why do I need one?

A maskable icon is a 512×512 PNG where your artwork fills the entire canvas. Android uses these to create "adaptive icons" that are shaped by the device (circle, squircle, etc.). The key requirement is that important content must be within the inner 80% "safe zone" circle, as the outer 10% can be cropped by the OS.

Do I need different favicons for light and dark mode?

You can use an SVG favicon with a <style> block that detects prefers-color-scheme to serve different artwork in dark vs light mode. For PNG/ICO favicons, most sites just use a single version that works on both. A simple white or transparent background icon usually works in both modes.

What is the Apple Touch Icon and when is it used?

The Apple Touch Icon (apple-touch-icon.png) is the image iOS uses when a user adds your website to their home screen as a bookmark. It is declared in your HTML <head> with <link rel="apple-touch-icon" href="/apple-touch-icon.png">. Apple recommends 180×180 px, which it scales down for older devices automatically.

Can I use an emoji as a favicon?

Yes, using an inline SVG favicon. You can set a single character emoji as a vector favicon that renders natively in the browser tab. This works in modern browsers but falls back to the default icon in older browsers. Our favicon generator supports emoji-to-favicon export.

Vous avez encore des questions ? Contactez notre équipe d’assistance.

Générez gratuitement votre ensemble de favicons

Créez en un clic toutes les tailles de favicon requises à partir d'une seule image : icônes ICO, PNG, Apple Touch Icon et icônes de manifeste PWA.