Klares Logo auswählen
Nutze möglichst ein quadratisches Motiv mit wenigen Formen und ausreichend Rand.
Browser-Icon in allen wichtigen Größen
Favicon und App-Symbole aus einem Bild erstellen
Aus einem Logo ein favicon.ico sowie quadratische PNG-Symbole für Browser, Apple-Geräte und Web-Apps in sechs gebräuchlichen Größen erstellen.
✓ Kostenlos✓ Ohne Anmeldung✓ Sofortiges Ergebnis
Die Verarbeitung erfolgt lokal in deinem Browser. Deine Bilder werden nicht hochgeladen.
Ergebnis verwenden
Rechenweg
So wird gerechnet
Die FormelFavicon = mittiger quadratischer Ausschnitt, skaliert auf die jeweilige Zielgröße
Einfaches Beispiel: Aus einem 1200 × 800 Pixel großen Logo wird zunächst ein mittiger 800 × 800-Ausschnitt und daraus jede benötigte Symbolgröße.
Mitte quadratisch zuschneiden
Nicht quadratische Vorlagen werden ohne Verzerrung mittig auf ein Quadrat beschnitten.
Browsergrößen herunterladen
Das Tool erzeugt favicon.ico sowie PNG-Dateien mit 16, 32, 48, 180, 192 und 512 Pixeln.
Einordnung in die Praxis
Favicon und App-Symbole aus einem Bild erstellen sinnvoll einordnen
Aus einem Logo ein favicon.ico sowie quadratische PNG-Symbole für Browser, Apple-Geräte und Web-Apps in sechs gebräuchlichen Größen erstellen. Die folgenden Hinweise zeigen, was hinter dem Wert steckt und wo die Grenzen der Rechnung liegen.
Favicons helfen, eine Website in Browser-Tabs, Lesezeichen und auf Startbildschirmen wiederzuerkennen. Sehr kleine Größen benötigen wesentlich einfachere Formen als ein normales Logo.
Browser verwenden unterschiedliche Dateien und können alte Favicons lange zwischenspeichern. Die erzeugten Symbole müssen anschließend korrekt im HTML beziehungsweise Web-App-Manifest verknüpft werden.
Teste vor allem die 16- und 32-Pixel-Version. Entferne kleine Schrift und feine Details, wenn das Symbol im Browser-Tab nicht eindeutig erkennbar bleibt.
Darauf solltest du achten
- Klares Logo auswählen
- Mitte quadratisch zuschneiden
- Browsergrößen herunterladen
Kurz beantwortet
Fragen aus der Praxis
Nur Fragen, die beim Rechnen oder Einordnen dieses Ergebnisses wirklich weiterhelfen.
Welches Ausgangsbild eignet sich am besten?
Ein quadratisches, einfaches Logo mit klaren Formen und ausreichend Abstand zum Rand bleibt auch bei 16 × 16 Pixeln erkennbar.
Welche Datei wird im Browser-Tab verwendet?
Viele Browser erkennen favicon.ico automatisch. Moderne Websites können zusätzlich konkrete PNG-Größen im HTML verlinken.
Warum werden mehrere Größen erzeugt?
Browser, Startbildschirme und Web-Apps verwenden unterschiedliche Auflösungen. Eine passende Quelldatei verhindert unnötig unscharfe Skalierung.