Zum Inhalt springen

Favicon-Generator: alle Symbole, die Ihre Website braucht

Erstellt favicon.ico, Apple- und Android-Icons und den HTML-Code aus einem Bild, Buchstaben oder Emoji.

oder hierher ziehen, oder mit Strg+V / ⌘V einfügen

Unterstützt: JPG, PNG, WebP, HEIC, SVG, AVIF, GIF, BMP, ICO, TIFF

Wenn Sie fortfahren, wird die Datei über eine verschlüsselte Verbindung hochgeladen und auf unserem Server umgewandelt. Sie können die Website währenddessen weiter nutzen. Das Original wird gelöscht, sobald es umgewandelt ist; das Ergebnis bleibt 7 Tage zum Herunterladen verfügbar und Sie können es jederzeit löschen. Dateien werden nie weitergegeben oder anderweitig verwendet.

Ihre Bilder werden in Ihrem Browser verarbeitet und nicht hochgeladen. Details zum Datenschutz

So verwenden Sie: Favicon-Generator

  1. 1 Wählen Sie ein Bild oder Logo oder wechseln Sie zu „Text oder Emoji“ und tippen Sie ein bis vier Zeichen.
  2. 2 Wählen Sie den Hintergrund (eine Farbe oder transparent), die Form und den Innenabstand.
  3. 3 Prüfen Sie die Vorschau in 16, 32, 48 und 180 Pixeln.
  4. 4 Laden Sie das ZIP herunter, legen Sie die Dateien ins Hauptverzeichnis Ihrer Website und fügen Sie die HTML-Zeilen in Ihre Seiten ein.

Über dieses Werkzeug

Ein Favicon ist das kleine Symbol in Browser-Tabs, Lesezeichen und auf dem Startbildschirm des Handys. Jeder Ort will eine andere Größe: Browser nutzen 16 und 32 Pixel, Windows bis 48, iPhones 180 und Android 192 und 512.

Dieser Generator erstellt alle aus einer Quelle: favicon.ico mit Bildern in 16, 32 und 48 Pixeln, PNG-Favicons, das Apple-Touch-Icon (immer mit Hintergrund, wie iOS es verlangt), Android-Icons, ein Web-Manifest und das HTML zum Einfügen. Starten Sie mit einem SVG-Logo, wird das SVG zusätzlich als modernes, skalierbares Favicon beigelegt.

Kleine Größen werden in mehreren Schritten verkleinert, damit Kanten scharf bleiben. Alles entsteht in Ihrem Browser; Ihr Logo wird nicht hochgeladen.

Häufig gestellte Fragen

Welche Dateien brauche ich?

favicon.ico funktioniert in jedem Browser. Die PNG-Dateien und das Apple-Touch-Icon sorgen für ein scharfes Symbol auf hochauflösenden Bildschirmen und Handy-Startbildschirmen, und das Manifest mit den Android-Icons wird genutzt, wenn jemand Ihre Website zum Android-Startbildschirm hinzufügt.

Wohin kommen die Dateien?

Ins Hauptverzeichnis Ihrer Website, sodass https://ihreseite.de/favicon.ico funktioniert. Fügen Sie dann die HTML-Zeilen in den <head>-Bereich Ihrer Seiten ein (die meisten Homepage-Baukästen haben dafür ein Feld).

Was macht ein gutes Favicon aus?

Eine einfache Form oder ein bis zwei Buchstaben mit starkem Kontrast. Feine Details und lange Texte sind bei 16 Pixeln unlesbar – prüfen Sie daher die 16-px-Vorschau.

Warum hat das Apple-Icon einen Hintergrund?

iOS zeigt transparente Touch-Icons auf schwarzem Hintergrund an, was oft falsch aussieht. Der Generator füllt das Apple-Icon deshalb immer mit Ihrer Hintergrundfarbe, oder mit Weiß, wenn Sie transparent gewählt haben.

Wird mein Logo hochgeladen?

Nein. Alle Symbole zeichnet Ihr eigener Browser, und das ZIP entsteht auf Ihrem Gerät.