Favicon-Generator
Lade ein beliebiges Bild hoch, um sofort ein «favicon.ico» in verschiedenen Grössen sowie PNG-Symbole für Apple Touch und Android/PWA zu generieren.
Dein Bild
Zieh ein Bild per Drag & Drop hierhin
oder durch deine Dateien stöbern – PNG, JPG oder WEBP
Grössen der Symbole
Wähle aus, welche Grössen generiert werden sollen – «favicon.ico» enthält immer 16/32/48px.
Rezensionen
Alles, was du über den Favicon-Generator wissen musst
Welche Grössen du tatsächlich benötigst, wie das .ico-Format funktioniert und wie du die Icons auf deiner Website einbindest.
- Lade ein quadratisches Bild hoch und erhalte sofort eine «favicon.ico»-Datei sowie PNG-Dateien für Apple und Android.
- Alles läuft lokal in deinem Browser ab – dein Bild wird zu keinem Zeitpunkt hochgeladen.
- Beginne mit einem quadratischen Bild von mindestens 5'120 × 5'120 Pixel, um bei jeder Grösse die schärfsten Ergebnisse zu erzielen.
So benutzt du den Favicon-Generator
- Zieh ein Bild per Drag & Drop hinein oder wähle eine Bilddatei aus – am besten ein quadratisches Bild mit mindestens 512×512 Pixel.
- Wähle aus, welche Icon-Grössen du benötigst: die Datei «favicon.ico» sowie die Apple-Touch- und Android-/PWA-PNG-Dateien.
- Lade «favicon.ico» direkt herunter oder lade alle ausgewählten PNG-Grössen zusammen als ZIP-Datei herunter.
Warum ein Favicon erstellen?
Ein Favicon ist das kleine Symbol, das Browser in Registerkarten, Lesezeichen und im Verlauf anzeigen – und dasselbe zugrunde liegende Bild wird nun auch für die Symbole auf dem Startbildschirm von Mobiltelefonen und für App-ähnliche PWA-Installationen verwendet. Um alle erforderlichen Grössen manuell richtig hinzubekommen, muss man dasselbe Bild immer wieder in verschiedenen Pixelabmessungen exportieren und anschliessend einige davon in einer einzigen .ico-Datei zusammenfassen.
Dieses Tool erledigt das in einem Durchgang: Lade ein Bild einmal hoch, und es generiert alle gängigen Grössen sowie eine korrekt verpackte favicon.ico – direkt in deinem Browser.
Welche Grössen du tatsächlich brauchst
| Grösse | Verwendet für | Warum es sich lohnt, einen Blick darauf zu werfen |
|---|---|---|
| 16/32/48px (.ico) Unverzichtbar | Browser-Tabs, Lesezeichen, Desktop-Verknüpfungen | Das klassische Favicon – jeder Browser erwartet es. |
| 180×180px | iOS «Zum Startbildschirm hinzufügen» | Apple-Geräte suchen nach dieser bestimmten Grösse und diesem Dateinamen. |
| 192×192 & 512×512 px | Android-Startbildschirm, Aufforderungen zur Installation von PWAs | Wird von den meisten Web-App-Manifesten für ein scharfes Installationssymbol benötigt. |
Favicon-Generator ohne Datei-Upload
Dein Bild wird direkt von JavaScript in deinem Browser mithilfe der Canvas-API gelesen – dabei wird es in der Grösse angepasst, neu gezeichnet und vollständig auf deinem Gerät in die .ico- und .zip-Dateien gepackt. Es wird zu keinem Zeitpunkt an einen Server übertragen, protokolliert oder gespeichert.
Da nichts hochgeladen wird, gibt es keine serverseitige Begrenzung der Dateigrösse; die einzige praktische Grenze besteht darin, wie gross ein Bild sein darf, das Ihr Browser problemlos in den Arbeitsspeicher laden kann.
Dein Bild verlässt dein Gerät zu keinem Zeitpunkt. Die Grössenanpassung und die Aufbereitung erfolgen vollständig auf der Client-Seite, wobei nichts protokolliert oder gespeichert wird.
Müssen Sie die Grösse des Quellbildes zuerst anpassen? Mit dem Tool «Image Resizer» können Sie es im Voraus vorbereiten.
.ico vs. PNG – was brauchst du eigentlich?
| Format | Am besten geeignet für | Abwägung |
|---|---|---|
| favicon.ico Diese Datei muss immer enthalten sein | Browser-Tabs und Lesezeichen | Fasst mehrere Grössen in einer Datei zusammen, wird jedoch nicht für Startbildschirm-Symbole verwendet. |
| PNG-Symbole (180/192/512 px) | Startbildschirm & PWA-Installationssymbole | Für Apple/Android separat erforderlich – eine .ico-Datei allein reicht hierfür nicht aus. |
Die meisten Websites benötigen beides: die .ico-Datei für den Browser-Tab sowie das PNG-Set, auf das in den HTML-Tags `<link>` und im Manifest der Web-App für die Startbildschirm-Symbole verwiesen wird.
Wofür nutzen die Leute den Favicon-Generator?
- Neue Websites: Erstellung eines kompletten Sets aus Favicon und Touch-Icon anhand eines Logos.
- Rebranding: Das alte Favicon wird überall dort ersetzt, wo es erwähnt wird.
- PWAs und Web-Apps: Erstellen der für ein Web-App-Manifest erforderlichen Icon-Grössen.
- Statische Website-Generatoren: Erstellung von Icon-Dateien, die direkt in den «public»-Ordner eines Projekts eingefügt werden können.
- Kundenprojekt: Schnelle Bereitstellung eines kompletten Icon-Sets ohne Design-Software.
So funktioniert dieses Tool
Dein Bild wird auf einer HTML-Canvas-Fläche in jeder ausgewählten Auflösung in der Grösse angepasst, anschliessend in einen standardkonformen .ico-Container (mit eingebetteten PNG-Frames) und optional in eine .zip-Datei mit einzelnen PNG-Dateien gepackt – alles wird live in deinem Browser mittels JavaScript generiert, ohne dass etwas hochgeladen, gespeichert oder protokolliert wird.
Zuletzt aktualisiert: 14. September 2026.
War dieser Leitfaden hilfreich?
Noch mehr Werkzeuge im Kasten
Auf der Startseite findest du vierzehn weitere kostenlose Tools, für die kein API-Schlüssel erforderlich ist.
Wortzähler
Aktuelle Wort-, Zeichen-, Satz- und Absatzzahlen.
Bildgrössenanpassung
Grösse von JPG-, PNG- und WEBP-Bildern nach Pixeln oder Prozent anpassen.
Bild in PDF
Bilde zu einer einzigen PDF-Datei zusammen, die heruntergeladen werden kann.
JSON-Formatierer
JSON aufbereiten, minimieren und mit Fehlerhinweisen validieren.
Passwortgenerator
Starke, zufällige Passwörter mit benutzerdefinierten Regeln.