Favicon-Generator
Browser erwarten mehrere Symbolgrößen: klassische 16×16 favicon.ico, 32×32 Tab-Symbole, 180×180 Apple-Touch-Symbole und 192×192 PWA-Symbole. Lade ein quadratisches Logo hoch und laden Sie ein komplettes Set herunter — lokal generiert, ohne deine Markenwerte an einen Server zu senden.
So generieren Sie Favicons
1. Lade ein quadratisches PNG oder JPG hoch (512×512 oder größer empfohlen).
2. Vorschau der generierten Größen.
3. Lade das Icon-Paket oder einzelne Dateien herunter.
4. Fügen Sie Link-Tags zu deinem HTML-Kopf hinzu und platzieren Sie Dateien in /public oder im Site-Root.
Beispiele für die Favicon-Einrichtung
Neue statische Website
Generieren Sie favicon.ico plus 32×32 PNG und fügen Sie standardmäßige Link-rel="icon"-Tags zu layout.html hinzu.
PWA-Manifest
Exportieren Sie 192×192 und 512×512 PNG für das Manifest.json-Symbolarray.
Rebranding-Tausch
Ersetzen Sie ein Master-Logo und generieren Sie alle Größen neu, damit Tabs und Startbildschirm-Verknüpfungen übereinstimmen.
Wann sollte ein Favicon-Generator verwendet werden?
• Wenn du eine Website starten und alle Standard-Symbolgrößen gleichzeitig benötigen.
• Wenn du ein Rasterlogo, aber keine ICO-Datei mit mehreren Größen haben.
• Wenn du lokale Generierung wünschen, ohne Markenwerte hochzuladen.
Checkliste für HTML-Link-Tags
Fügen Sie rel="icon" für PNG-Größen, rel="apple-touch-icon" für iOS und optional manifest.json für PWAs ein. Platzieren Sie Dateien an vorhersehbaren Pfaden (/favicon.ico hilft immer noch alten Crawlern).
Häufige Fragen
Welche Größe sollte das Quellbild haben?
Mindestens 512×512 px im Quadrat. Größere Master lassen sich besser herunterskalieren als kleine Logos hochskalieren.
ICO vs. PNG-Favicon?
Moderne Browser akzeptieren PNG; .ico bündelt mehrere Größen für ältere Windows-Registerkarten.
Apple-Touch-Icon-Größe?
180×180 Pixel für iOS-Startbildschirm-Verknüpfungen — verwenden Sie PNG ohne Transparenz, um die besten Ergebnisse zu erzielen.
Transparenter Hintergrund?
Funktioniert für PNG-Registerkarten; iOS-Startsymbole werden möglicherweise weiß matt — auf dem Gerät testen.
SVG-Quelle?
Konvertieren Sie SVG zunächst mit hoher Auflösung in PNG und generieren Sie dann Favicons.