Welche Größen sind enthalten?

Das Paket enthält üblicherweise die Größen 16, 32, 48, 180, 192 und 512 Pixel sowie eine favicon.ico-Datei mit mehreren Größen.

Wie sieht ein transparentes Logo auf einem dunklen Browser-Tab aus?

Nutze die Vorschau auf dunklem Hintergrund. Bei kleinen Symbolen kann ein dezenter Hintergrund die Erkennbarkeit verbessern.

Wie installiere ich die Symbole auf der Website?

Lege die Dateien im Verzeichnis public/ ab und gib die entsprechenden Größen im HTML-Dokument und im Web-App-Manifest an.

Favicon-Generator

Erzeuge aus einem quadratischen Logo favicon.ico und PNG-Symbole in Größen von 16 bis 512 Pixeln. Lade anschließend ein vollständiges ZIP-Paket für deine Website herunter.

Dateien und Inhalte werden lokal im Browser verarbeitet und nicht auf unseren Server hochgeladen.

Über dieses Tool

Erstelle aus einem quadratischen Logo im PNG- oder SVG-Format ein vollständiges Symbolpaket für deine Website. Das ZIP-Paket enthält PNG-Dateien in den Größen 16×16, 32×32, 180×180, 192×192 und 512×512 Pixel sowie eine favicon.ico-Datei mit mehreren Größen. Prüfe die Darstellung auf hellen und dunklen Hintergründen, bevor du das Paket herunterlädst.

Anleitung

PNG-Symbole in mehreren Größen
favicon.ico-Datei mit den gebräuchlichen Größen
Empfohlene Größen für Apple Touch und PWA
Vorschau auf hellen und dunklen Hintergründen
Download als ZIP-Datei
Logo hochladen: Verwende ein quadratisches Bild mit mindestens 512×512 Pixeln, damit die verkleinerten Symbole möglichst deutlich bleiben.
Größen prüfen: Prüfe, ob das Logo auch bei 16 und 32 Pixeln noch gut erkennbar ist.
ZIP-Datei herunterladen: Lege die Dateien im öffentlichen Verzeichnis deiner Website ab und verweise im HTML-Dokument sowie im Web-App-Manifest auf die entsprechenden Größen.

Beispiele

Favicons für statische Websites mit Vite oder React erstellen
PWA-Symbole und Web-App-Manifest nach einer Änderung der Marke aktualisieren
Ein Apple-Touch-Symbol für iOS-Lesezeichen erzeugen
Schnell ein vollständiges Symbolpaket ohne zusätzliche Befehlszeilentools erstellen

Einschränkungen

Logos mit sehr vielen Details können bei 16×16 Pixeln unkenntlich werden; vereinfache das Motiv bei Bedarf
SVG-Dateien werden für die Ausgabe in PNG- und favicon.ico-Dateien mit der ausgewählten Maximalgröße umgewandelt
Das hochgeladene Logo wird direkt im Browser verarbeitet und nicht an einen Server gesendet.

FAQ

Welche Größen sind enthalten?: Das Paket enthält üblicherweise die Größen 16, 32, 48, 180, 192 und 512 Pixel sowie eine favicon.ico-Datei mit mehreren Größen.
Wie sieht ein transparentes Logo auf einem dunklen Browser-Tab aus?: Nutze die Vorschau auf dunklem Hintergrund. Bei kleinen Symbolen kann ein dezenter Hintergrund die Erkennbarkeit verbessern.
Wie installiere ich die Symbole auf der Website?: Lege die Dateien im Verzeichnis public/ ab und gib die entsprechenden Größen im HTML-Dokument und im Web-App-Manifest an.