Favicon-Größen erklärt

Das 16×16 Pixel große Favicon ist der ursprüngliche Webstandard. Es wird in Browser-Registerkarten auf Standardanzeigen (96 dpi), in der Lesezeichen-Symbolleiste aller Desktop-Browser und in einigen Browser-Verlaufslisten verwendet. Da 16×16 eine extrem kleine Leinwand ist, muss Ihr Favicon-Design auf seine einfachste Form reduziert werden: eine einzelne Form, ein Buchstabe oder ein abstraktes Zeichen. Alles, was komplexer ist, wird unleserlich sein.

Die Pixelgröße von 32 x 32 verdoppelt die Größe von 16 x 16 und bietet Retina-/HiDPI-Browserregisterkarten mit doppelter Dichte, Lesezeichensymbole mit hoher DPI und Vorschlagssymbole für die Adressleiste in Chrome. Moderne Browser fordern weitaus häufiger 32×32 an als 16×16, da Displays mit hoher Dichte mittlerweile die Mehrheit der Geräte ausmachen. Wenn Sie nur eine Größe versenden könnten, wäre 32×32 die wirkungsvollste Wahl.

Die Pixelgröße von 48 × 48 Pixeln entspricht der Ansichtsgröße „mittlere Symbole“ des Windows Explorers und ist die Mindestgröße, die von der Google-Suche für die Favicon-Berechtigung in Suchergebnis-Snippets gefordert wird. Websites, deren Favicon die Mindestgröße von 48 x 48 nicht erreicht, werden in den Google-Ergebnissen mit einem generischen Globussymbol neben ihrer URL anstelle ihres Markenzeichens angezeigt. Fügen Sie Ihrem .ico-Bundle immer 48×48 hinzu.

Die Größe 64×64 Pixel wird in der großen Symbolansicht des Windows Explorer und in einigen Linux-Desktop-Umgebungen verwendet. Das Einfügen in Ihre .ico-Datei mit mehreren Größen verursacht nur einen vernachlässigbaren Mehraufwand, sorgt aber für eine saubere Darstellung in Dateimanagern und Shell-Umgebungen. Viele Favicon-Generator-Tools enthalten standardmäßig 64 als Teil des Standard-.ico-Pakets.

Die Größe von 128 x 128 Pixeln bietet Windows Store-App-Kacheln und Miniaturansichten der Taskleiste mit hoher Dichte. Für reine Web-Favicons wird es seltener benötigt, ist aber wichtig, wenn Ihre Website als PWA verpackt ist oder wenn Benutzer sie als Windows-App anpinnen. Durch die Bündelung in .ico mit PNG-Komprimierung bleibt die Dateigröße angemessen.

Die Größe von 256×256 Pixeln ist der größte Standard-.ico-Frame. Es wird für Windows-Desktopverknüpfungen, die Suchergebnisse des Windows-Startmenüs und einige App-installierte Kontexte verwendet. Bei dieser Auflösung müssen Sie die PNG-Komprimierung innerhalb des .ico-Containers anstelle von BMP verwenden – ein unkomprimiertes BMP-256×256-Bild fügt der .ico-Datei unnötigerweise 256 KB hinzu.

Die Pixelgröße 180×180 gilt ausschließlich für iOS apple-touch-icon. Wenn ein iPhone- oder iPad-Benutzer auf „Zum Startbildschirm hinzufügen“ tippt, ruft Safari das in „<link rel='apple-touch-icon' size='180x180' href='/apple-touch-icon.png'>` deklarierte Bild ab. Diese Größe deckt alle aktuellen iPhone-Modelle ab (iPhone 6 Plus und höher verwenden 180×180 bei 3-facher Dichte; ältere Modelle verwenden 120×120 und 152×152 – eine einzige 180-Datei deckt sie alle elegant ab).

Die Pixelgröße von 192 x 192 ist das minimal erforderliche Symbol in einem Web-App-Manifest (site.webmanifest) für die PWA-Installationsaufforderung von Android Chrome. Wenn Benutzer einen PWA zu ihrem Android-Startbildschirm hinzufügen, rendert Chrome das 192×192-Symbol im Launcher und das App-Symbol im zuletzt verwendeten Apps-Umschalter. Ohne diese Größe im Manifest zeigt die PWA-Installationsaufforderung entweder ein generisches Symbol an oder wird überhaupt nicht ausgelöst.

Die Größe 512 x 512 Pixel ist das zweite erforderliche Manifestsymbol. Chrome verwendet es für den Begrüßungsbildschirm PWA, der angezeigt wird, während die App nach dem Start auf dem Startbildschirm geladen wird, und für die Vorschau des Installationsdialogs auf dem Desktop-Betriebssystem Chrome. Es ist auch die ideale Quellgröße für die Generierung aller kleineren Varianten – ab 512×512 wird sichergestellt, dass jede heruntergesampelte Ausgabe scharfe Kanten und genaue Farben behält.

Größen zwischen 512×512 und den sehr großen 1024×1024 werden hauptsächlich für native App-Symbole auf macOS und iOS App Store-Einreichungen verwendet, nicht für Web-Favicons. Wenn Sie jedoch planen, Ihre Webpräsenz mithilfe eines Wrappers (Electron, Capacitor, Tauri) in eine native App umzuwandeln, benötigen Sie 1024×1024 für den App Store-Überprüfungsprozess. Speichern Sie diese Masterdatei zusammen mit Ihrem Favicon-Paket.

SVG-Favicons sind auflösungsunabhängig und decken jede Dichte mit einer einzigen Datei ab. Ein Browser, der SVG-Favicons (Chrome 80+, Edge 80+, Firefox 41+, Safari 15+) unterstützt, wird SVG gegenüber jeder Rastergröße bevorzugen, da es bei 1x, 2x, 3x oder jeder benutzerdefinierten DPI perfekt gerendert wird. Der Nachteil besteht darin, dass nicht alle Kontexte SVG unterstützen – Windows-Verknüpfungen, RSS-Reader und ältere Tools benötigen weiterhin den .ico-Fallback.

Es ist wichtig, den Zusammenhang zwischen Größen und dem .ico-Container zu verstehen. Eine .ico-Datei ist kein einzelnes Bild, sondern ein Archiv mit mehreren Bildern. Jeder darin enthaltene Rahmen ist ein separates Rasterbild in einer anderen Größe. Der Browser liest das Verzeichnis ICO, ermittelt, welcher Frame am besten zu der benötigten Größe passt, und dekodiert nur diesen Frame. Aus diesem Grund kann eine .ico-Datei gleichermaßen Tabs mit 16, 32, 48 und 64 Pixeln bereitstellen.

Der empfohlene Mindestsatz für eine Produktionswebsite im Jahr 2026 ist: favicon.ico mit 16, 32, 48 und 64 Pixel großen Frames; apple-touch-icon.png bei 180×180; android-chrome-192x192.png; android-chrome-512x512.png; favicon.svg für moderne Browser; und ein site.webmanifest, der auf die PNGs 192 und 512 verweist. Der favicon generator erstellt dieses komplette Set aus einem einzigen Quell-Upload mit einem Klick.

Mit dem favicon tester können Sie problemlos überprüfen, ob alle Ihre Favicon-Größen korrekt bereitgestellt werden. Geben Sie die URL Ihrer Website ein und der Tester versucht, Ihr favicon.ico abzurufen, sucht nach den Link-Tags in Ihrem HTML-Kopf und zeigt eine Vorschau jeder Größe an. Fehlende Größen werden mit umsetzbaren Empfehlungen gekennzeichnet.