Bild-Resizer
Legen Sie die Bildabmessungen und eine optionale Größenbeschränkung für JPEG-Dateien fest. Behalten Sie das gesamte Bild bei oder fügen Sie Ränder hinzu, um eine exakte Leinwand zu erhalten.
Bildervor Ort verarbeitet
Favicon-Generator
Erstellen Sie ICO- und PNG-Favicons, zeigen Sie eine Vorschau kleiner Symbole an und laden Sie eine vollständige ZIP-Datei in Ihrem Browser herunter.
Wählen Sie ein Bild, legen Sie Abstand und Hintergrundfarben fest, prüfen Sie die kleinen Vorschauen und erstellen und laden Sie die ZIP-Datei herunter.
Verwandeln Sie Ihr Logo in ein Favicon-SetWählen Sie ein Bild aus oder legen Sie es hier abPNG, JPEG, WebP oder SVG · 10 MB · 4096 Pixel pro Seite
Nicht unterstützte SVG-Inhalte wurden entfernt. Überprüfen Sie vor dem Herunterladen die Vorschau.
Überprüfen Sie die winzigen Größen
Die 16-, 32- und 48-Pixel-Vorschauen werden in Originalgröße angezeigt. Bei 16 Pixeln können feine Details verschwinden.
Ihr Favicon-Set ist fertig
Die ZIP-Datei enthält 9 Dateien: ICO, SVG, fünf PNGs, ein Symbolmanifest und das HTML-Snippet.
favicon.icofavicon.svgfavicon-16x16.pngfavicon-32x32.pngapple-touch-icon.pngandroid-chrome-192x192.pngandroid-chrome-512x512.pngsite.webmanifestfavicon-html.txt
Favicon-HTML-Snippet · <head>
Hosten Sie die Dateien auf Ihrer Site und passen Sie die Pfade an. Symboleinträge in ein vorhandenes Manifest einbinden.
Wie zu verwenden
Erstellen Sie ein Favicon-Set
Wählen Sie ein Bild, legen Sie Abstand und Hintergrundfarben fest, prüfen Sie die kleinen Vorschauen und erstellen und laden Sie die ZIP-Datei herunter.
Beispiel und erwartetes Ergebnis
Beispiel: Laden Sie ein transparentes 1024×1024-Logo hoch, behalten Sie die Transparenz bei und verwenden Sie 10 % Abstand. Die ZIP-Datei enthält ICO (16/32/48), fünf PNGs, ein SVG mit einem PNG, ein Symbolmanifest und das HTML-Snippet. Einfache Markierungen bleiben bei 16 Pixel klarer; feine Details können verschwinden.
Was ist ein Favicon?
Ein Favicon ist das kleine Symbol, das Browser in Tabs, Lesezeichen und im Verlauf neben dem Titel Ihrer Seite anzeigen. Es ist winzig – oft nur 16×16 Pixel – daher ist ein gutes Favicon einfach, kontrastreich und auf den ersten Blick erkennbar. Dieser Generator konvertiert Ihr Bild vollständig in Ihrem Browser in gängige Favicon-Größen. Es wird nichts hochgeladen.
Größen, die Sie im Jahr 2026 benötigen
| Datei | Größe | Verwendet für |
|---|---|---|
| favicon.ico | 16, 32, 48 | Browser-Registerkarten und Lesezeichen |
| favicon.svg | 512 × 512 | SVG-fähige Browser; eingebettetes PNG |
| favicon-16x16.png, favicon-32x32.png | 16, 32 | PNG-Fallbacks |
| apple-touch-icon.png | 180 × 180 | iOS-Startbildschirm und Safari |
| android-chrome-192x192.png, android-chrome-512x512.png | 192, 512 | Android- und PWA-Symboleinträge |
Formate und Grenzen
PNG-, JPEG-, WebP- und einfache SVG-Eingaben werden unterstützt. Die Dateien sind auf 10 MB und 4096 Pixel pro Seite begrenzt. Animierte Bilder werden nicht unterstützt. SVG-Eingaben werden in Ihrem Browser gerastert; Skripte, externe Referenzen, Bilder, Stylesheets, Filter und Animationen werden entfernt und nicht gerendert. Der Text verwendet verfügbare lokale Schriftarten. Überprüfen Sie in der Vorschau, ob Ihr SVG diese Funktionen verwendet.
Der ICO enthält 16×16, 32×32 und 48×48 PNG-komprimierte Einträge. Beim Herunterskalieren wird ein mehrstufiges Resampling verwendet, aber ein detailliertes Foto verliert bei 16 Pixeln immer noch an Details – einfache Markierungen funktionieren am besten. Bei Auswahl bleibt die Transparenz in ICO und PNG erhalten; Das Apple Touch-Symbol verwendet einen einfarbigen Hintergrund. Die SVG-Ausgabe bettet ein PNG ein und ist keine Vektorkonvertierung. Ihr Original bleibt unverändert.
FAQ
Welche Größe sollte mein Favicon haben?
Versenden Sie das ICO in mehreren Größen (16/32/48), ein 180×180 Apple Touch-Symbol und 192/512 PNGs für Android. Hierbei handelt es sich um gängige Browser- und Gerätegrößen, es handelt sich jedoch nicht um eine Garantie dafür, dass jede Plattform jede Datei verwendet.
ICO oder PNG – welches brauche ich?
Beziehen Sie den ICO-Fallback und PNG- oder SVG-Alternativen ein. Kopieren Sie das HTML-Snippet und aktualisieren Sie dann die Pfade so, dass sie mit dem Hostort der Dateien übereinstimmen.
Unterstützen Browser SVG-Favicons?
Viele moderne Browser unterstützen SVG-Favicons. Behalten Sie den ICO-Fallback für Browser bei, die dies nicht tun. Dieses Tool bettet ein 512×512 PNG in das SVG ein; Ihr Logo wird nicht in Vektorpfade umgewandelt.
Ich habe mein Favicon ersetzt, aber das alte wird immer noch angezeigt. Warum?
Browser speichern Favoriten aggressiv zwischen. Versuchen Sie eine vollständige Aktualisierung oder leeren Sie den Browser-Cache. Überprüfen Sie die Dateipfade und ändern Sie den Dateinamen oder die Versionsabfrage, wenn das zwischengespeicherte Symbol weiterhin besteht.
Funktioniert mein transparenter Hintergrund auf iPhones?
Das Apple Touch-Symbol wird immer auf die hier ausgewählte Apple-Hintergrundfarbe reduziert. ICO- und andere PNG-Dateien behalten bei Auswahl ihre Transparenz.
Kann diese ZIP-Datei meine Website als PWA installieren?
Nein. Das Manifest enthält nur Symboleinträge. Fügen Sie sie in Ihr bestehendes Manifest ein oder fügen Sie den Namen, die Start-URL und andere PWA-Einstellungen hinzu, die Ihre Website benötigt.