Was der Favicon-Generator macht
Mit dem Favicon-Generator können Sie aus einem einzigen Bild einen vollständigen Satz von Favicon-Icons für Ihre Website erstellen. Das Tool generiert automatisch Dateien für verschiedene Browser, Geräte und Plattformen.
Das Tool hilft Ihnen dabei:
Favicons aus PNG-, JPG- und anderen Bildformaten zu erstellen
Icon-Sets in mehreren Größen zu generieren
HTML-Code für die Einbindung zu erhalten
Favicons für Browser, Android und iOS vorzubereiten
eine Vorschau der Darstellung des Favicons anzuzeigen
Geeignet für Websites, Webanwendungen, Landingpages und PWAs.
Was ist ein Favicon?
Ein Favicon ist ein kleines Website-Symbol, das angezeigt wird in:
Browser-Tabs
Lesezeichen
dem Browserverlauf
Suchmaschinen
mobilen Geräten
PWAs und Verknüpfungen
Favicons helfen Nutzern, eine Website schnell zu erkennen, und verbessern die Sichtbarkeit einer Marke.
Das Tool erstellt Favicons automatisch in gängigen Größen und Formaten.
Größe | Typ | Verwendung |
|---|
16×16 | Favicon | Browser-Tabs, Lesezeichen |
32×32 | Favicon | Desktop-Browser |
48×48 | App-Icon | Windows, Desktop-Verknüpfungen |
96×96 | App-Icon | Android-Verknüpfungen, Launcher-Icons |
128×128 | App-Icon | Chrome Apps, PWAs, Desktop-Launcher |
180×180 | Apple-Touch-Icon | iPhone, iPad |
192×192 | Manifest-Icon | Android, PWAs |
512×512 | Manifest-Icon | PWAs, Anwendungen |
Moderne Websites verwenden in der Regel mehrere Favicon- und App-Icon-Größen, um eine korrekte Darstellung auf unterschiedlichen Geräten und Plattformen sicherzustellen.
So wählen Sie ein geeignetes Bild aus
Für Favicons eignen sich am besten:
einfache Formen
hoher Kontrast
wenige Details
große visuelle Elemente
quadratische Bilder
Kleine Details und Text sind bei einer Größe von 16×16 px nur schwer lesbar.
Favicon-Vorschau
Das Tool zeigt, wie Ihr Favicon aussehen wird:
So können Sie Lesbarkeit und visuelle Wirkung vor der Veröffentlichung überprüfen.
Praktische Empfehlungen
Verwenden Sie ein quadratisches Bild mit mindestens 512×512 px
Testen Sie das Favicon sowohl im hellen als auch im dunklen Design
Vermeiden Sie kleinen Text und dünne Linien
Verwenden Sie für Marken vorzugsweise ein Logo oder Monogramm
Überprüfen Sie nach der Aktualisierung des Favicons dessen Darstellung in der Google Search Console und in den wichtigsten Browsern
Warum ein Favicon schlecht aussehen kann
Zu komplexes Design: Kleine Elemente werden unleserlich.
Verwendung von Text: Text geht bei kleinen Größen fast immer verloren.
Zu geringer Kontrast: Helle Favicons sind in Browsern und dunklen Designs oft schwer erkennbar.
Ungeeignetes Ausgangsbild: Unscharfe oder niedrig aufgelöste Bilder verschlechtern die Qualität des Favicons.
Lorem Ipsum