Favicon-Generator
Machen Sie aus einem Bild favicon.ico, PNG-Icons, apple-touch-icon, ein Webmanifest und einbaufertigen HTML-Code.
Bild hier ablegen oder auswählen (PNG, JPG, WebP, SVG)
So erstellen Sie ein Favicon-Set
- Wählen Sie ein PNG-, JPG-, WebP- oder SVG-Bild. Am besten eignet sich ein quadratisches Bild mit mindestens 512×512 px oder ein SVG.
- Entscheiden Sie, ob das ganze Bild eingepasst (mit leerem Rand) oder das Quadrat durch Beschneiden der Ränder ausgefüllt werden soll.
- Wählen Sie einen transparenten Hintergrund oder eine Farbe und, wenn Sie möchten, einen Seitennamen für das Manifest.
- Laden Sie jede Datei einzeln oder das gesamte ZIP herunter und kopieren Sie dann den HTML-Code in den <head> Ihrer Seite.
Das erhalten Sie
Das Set enthält favicon.ico mit Icons in 16, 32 und 48 px, favicon-16x16.png, favicon-32x32.png, apple-touch-icon.png (180×180), android-chrome-192x192.png, android-chrome-512x512.png und site.webmanifest. Laden Sie die Dateien in das Stammverzeichnis Ihrer Website hoch, damit die Pfade zum erzeugten Code passen.
Tipps und Datenschutz
- Feine Details gehen bei kleinen Größen verloren, daher eignen sich ein schlichtes Zeichen oder ein einzelner Buchstabe mit starkem Kontrast am besten.
- Das apple-touch-icon darf nicht transparent sein: iOS zeigt transparente Bereiche schwarz an, deshalb erhält dieses Icon einen weißen Hintergrund, wenn Sie keine Farbe gewählt haben.
- Browser speichern Favicons sehr hartnäckig im Cache, eine Änderung wird daher möglicherweise nicht sofort sichtbar.
- Alles wird auf Ihrem Gerät verarbeitet, das Bild wird nie hochgeladen.