Vollständigen Favicon-Kit erzeugen

Laden Sie ein Bild hoch und erhalten Sie mit einem Klick einen vollständigen Favicon-Kit: alle gängigen PNG-Größen (16 bis 512 px), eine favicon.ico-Datei und den HTML-Code der <link>-Tags zum Kopieren in Ihre Website.

Idealerweise ein quadratisches Bild in guter Auflösung (Logo, Symbol...). Per Drag-and-drop ablegen oder zum Durchsuchen anklicken.

So funktioniert es

Anders als ein einfacher Favicon-Generator, der nur zwei oder drei Größen liefert, deckt dieser Kit alle gängigen Einsatzbereiche ab: Browser-Tabs, Windows-Verknüpfungen, Startbildschirm-Symbole unter iOS und Android sowie eine klassische favicon.ico-Datei für maximale Kompatibilität. Jede Größe wird durch Skalierung mit zentriertem Zuschnitt erzeugt, damit das Hauptmotiv Ihres Bildes auch in den kleinsten Varianten gut im Ausschnitt bleibt.

Wo platziere ich die erzeugten Dateien auf meiner Website?

Legen Sie alle PNG-Dateien und die favicon.ico im Stammverzeichnis Ihrer Website ab (zum Beispiel /favicon-32x32.png) und fügen Sie dann den bereitgestellten HTML-Code in den Bereich <head> Ihrer Seiten ein. Die erwähnte Datei site.webmanifest ist optional: Sie ermöglicht es, zusätzliche Symbole für PWAs zu definieren, falls Sie separat eine erstellen.

Warum so viele verschiedene Größen erzeugen?

Jede Plattform und jeder Anzeigekontext erwartet eine bestimmte Größe: 32×32 für den Desktop-Tab, 180×180 für das iOS-Startbildschirm-Symbol, 192×192 und 512×512 für Android-App-Symbole und PWAs. Wenn Sie alle diese Größen bereitstellen, muss kein System Ihr Bild selbst skalieren, was oft zu einer unscharfen oder verpixelten Darstellung führt.

100% lokale Verarbeitung: Die Skalierung erfolgt über die Canvas-API Ihres Browsers und die favicon.ico über WebAssembly — Ihr Logo wird nie an einen Server gesendet.