Zusammenfassung (TL;DR)
- Universelle Eingabe: Konvertieren Sie PNG, JPG, WebP oder SVG in ein gültiges Favicon-Set.
- Intelligente Größe: Wählen Sie zwischen “Cover” (Füllen) oder “Contain” (Einpassen), um quadratische Icons perfekt anzupassen.
- Produktionsstandard: Erzeugt nicht nur eine Datei, sondern den essenziellen Mix aus
favicon.ico+ PNGs für moderne Web-Kompatibilität.
Warum einen speziellen Konverter nutzen?
Sie können logo.png nicht einfach in favicon.ico umbenennen. Das ICO-Format ist ein spezieller Container, der mehrere Rasterbilder verschiedener Größen enthält. Browser benötigen dies, um die schärfste Version auszuwählen.
Dieses Tool handhabt die technische Komplexität:
- Resampling: Hochwertige Downsampling-Filter (Lanczos3), um unscharfe 16x16 Icons zu vermeiden.
- Container-Bau: Kompilierung von 16x16, 32x32 und 48x48 Versionen in eine einzige
.ico-Datei. - Moderne Fallbacks: Generierung von Standard-PNGs (192x192, 512x512) für Android, PWA und Retina-Displays.
Intelligentes Zuschneiden: Cover vs Contain
Die meisten Logos sind rechteckig, aber Favicons müssen quadratisch sein.
1. Cover (Zuschneiden zum Füllen)
- Verhalten: Zoomt hinein, bis das Bild das Quadrat füllt. Ränder werden abgeschnitten.
- Am besten für: Symbole oder Icons, die annähernd quadratisch sind.
2. Contain (Zentriert einpassen)
- Verhalten: Verkleinert das Bild, damit es vollständig in das Quadrat passt, und fügt transparenten Rand hinzu.
- Am besten für: Breite Wortmarken oder hohe Logos.
Pro-Tipp: Wenn Ihr Logo eine breite Wortmarke ist, versuchen Sie nicht, es in ein 16x16 Quadrat zu quetschen. Es wird unleserlich sein. Erstellen Sie eine vereinfachte Variante (Initiale).
Das ICO-Format verstehen
Die .ico-Datei ist einzigartig. Anders als PNG ist sie ein Verzeichnis von Bildern.
- 16x16: Das Standard-Tab-Icon auf dem Desktop.
- 32x32: Für High-DPI (Retina) Bildschirme.
- 48x48: Von Windows für Desktop-Icons genutzt.
Best Practices
- Groß anfangen: Laden Sie ein Bild mit mindestens 512x512 Pixeln hoch.
- Kontrast prüfen: Stellen Sie sicher, dass Ihr Logo auf hellen und dunklen Hintergründen sichtbar ist.
- Transparenz ist wichtig: Nutzen Sie transparentes PNG oder SVG.
FAQ
Warum sieht mein Favicon unscharf aus?
Bei 16x16 Pixeln haben Sie nur 256 Punkte. Nutzen Sie ein einfacheres Design.
Kann ich nur ein PNG nutzen?
Die meisten modernen Browser unterstützen PNG, aber für strikte Legacy-Unterstützung ist favicon.ico nach wie vor sicherer.