Favicon-Generator

Favicons, Apple-Touch-Icon und Manifest aus einem Logo erzeugen.

Aus einem Logo alle Favicon-Größen von 16 bis 512 Pixeln erzeugen, mit Apple-Touch-Icon, Manifest-Datei und HTML-Code. Das Logo bleibt im Browser.

Welche Favicons eine Website braucht

Auf einen Blick

Für Browser-Tabs reichen Symbole in 16 × 16 und 32 × 32 Pixeln.
iPhones und iPads verwenden für Verknüpfungen auf dem Startbildschirm ein Apple-Touch-Icon in 180 × 180 Pixeln.
Android und installierbare Web-Apps erwarten Symbole in 192 × 192 und 512 × 512 Pixeln, eingetragen in einer Manifest-Datei (site.webmanifest).
Das Werkzeug erzeugt alle fünf Größen, die Manifest-Datei und den HTML-Code für den Kopfbereich; das Logo wird dabei nicht hochgeladen.

Stand: Oktober 2026. Quelle: Web Application Manifest (W3C) und Apple Developer Documentation „Configuring Web Applications“.

Wo das kleine Symbol überall erscheint

Das Favicon steht im Browser-Tab, in Lesezeichen, im Verlauf und in den Suchergebnissen von Google neben dem Namen der Website. Auf Smartphones wird es zum App-Symbol, wenn jemand die Seite auf den Startbildschirm legt. Fehlt es, zeigt der Browser ein leeres Blatt, und in Suchergebnissen steht ein graues Weltkugel-Symbol.

Die Größen im Überblick

16 × 16 Pixel: Browser-Tab auf normalen Bildschirmen.
32 × 32 Pixel: Browser-Tab auf hochauflösenden Bildschirmen, Taskleiste unter Windows.
180 × 180 Pixel: Startbildschirm auf iPhone und iPad.
192 × 192 Pixel: Startbildschirm unter Android.
512 × 512 Pixel: Startbild installierbarer Web-Apps und Darstellung im App-Menü.

Was ein gutes Favicon ausmacht

Ein vollständiges Logo mit Schriftzug ist in 16 Pixeln nicht lesbar. Besser funktioniert ein einzelner Buchstabe oder das Bildzeichen des Logos mit kräftigem Kontrast. Als Vorlage eignet sich eine quadratische Grafik von mindestens 512 Pixeln Kantenlänge, am besten als PNG mit transparentem Hintergrund oder als SVG. iPhones stellen transparente Flächen auf dem Startbildschirm nicht durchsichtig dar; deshalb lohnt sich beim Apple-Touch-Icon eine eigene Hintergrundfarbe.

Einbau in die Website

Die Dateien aus dem ZIP-Paket gehören in das Hauptverzeichnis der Website. Den HTML-Code, den das Werkzeug unter den Downloads anzeigt, fügst du in den Kopfbereich (head) jeder Seite ein. Danach kann es einige Tage dauern, bis Google das neue Symbol in den Suchergebnissen zeigt.

Hinweis zur Datei favicon.ico

Manche Programme, etwa ältere Feed-Leser, fragen ohne Hinweis im HTML-Code die Adresse /favicon.ico ab. Das Paket enthält deshalb auch diese Datei. Sie enthält das 32-Pixel-Bild im PNG-Format, das alle aktuellen Browser unter diesem Namen lesen. Nur sehr alte Programme verlangen das echte ICO-Format; dafür lässt sich die Datei mit einem Bildprogramm umwandeln.