Zum Inhalt springen
helpyself

Favicon-Generator

Local only — nothing is uploaded unless you save or share it.

Ein Favicon-Generator, der aus einem beliebigen Bild einen vollständigen Satz macht.

  1. Legen Sie ein quadratisches Bild ab, idealerweise 512×512 oder größer
  2. Laden Sie die Icons herunter, oder die einzelnen Größen, die Sie brauchen
  3. Fügen Sie den HTML-Schnipsel in den Head Ihrer Seite ein

Link teilen

Speichert das in Ihren Dateien und gibt Ihnen eine Adresse, die jeder öffnen kann. Sie läuft von selbst ab.

Link gilt
Tool speichern

Favicon-Generator griffbereit halten

Als Lesezeichen

Über dieses Tool

Ein Favicon war früher eine kleine Datei und ist heute eine kleine Sammlung, denn Browser, iOS-Startbildschirme und Android-Launcher wollen alle verschiedene Größen. Dieser Generator erzeugt den Satz, auf den es tatsächlich ankommt, statt des historischen Haufens von zwanzig Dateien: eine favicon.ico mit mehreren Auflösungen, die Versionen mit 16, 32 und 48 Pixeln für die Browserleiste und Lesezeichen enthält, eigenständige PNGs mit 16 und 32 für moderne Browser, ein Apple-Touch-Icon mit 180 Pixeln und Icons mit 192 und 512 Pixeln für Android und progressive Web-Apps. Er gibt Ihnen außerdem das HTML zum Einfügen in Ihren Head und die Manifest-Einträge für die Android-Größen, denn zu wissen, welche Dateien zu erzeugen sind, ist nur die halbe Aufgabe. Nicht quadratische Bilder werden auf ein zentriertes Quadrat beschnitten statt gequetscht, denn ein gestrecktes Logo mit 16 Pixeln ist unlesbar. Alles wird in Ihrem Browser erzeugt, Ihr Logo wird also nie hochgeladen.

Häufige Fragen

Wie groß sollte mein Ausgangsbild sein?

Mindestens 512×512, und quadratisch. Alles wird von Ihrem Original herunterskaliert, klein anzufangen erzeugt also weiche Icons in den größeren Größen. Ein Vektorlogo, mit 1024×1024 exportiert, liefert die saubersten Ergebnisse.

Brauche ich noch eine favicon.ico?

Ja, wenn auch weniger als früher. Browser fordern /favicon.ico standardmäßig an, auch ohne Link-Tag, und sie ist noch immer das, was in manchen Lesezeichen- und Verlaufsansichten erscheint. Die .ico hier enthält drei Auflösungen, damit Browser die schärfste wählen können.

Warum wird mein nicht quadratisches Logo beschnitten?

Weil jeder Favicon-Platz quadratisch ist, und ein breites Logo passend zu strecken macht es bei 16 Pixeln unlesbar. Es wird das größte zentrierte Quadrat genommen. Wenn das etwas Wichtiges abschneidet, bereiten Sie zuerst eine quadratische Fassung Ihrer Marke vor — die meisten Marken haben genau dafür eine.

Warum aktualisiert sich mein Favicon nach dem Hochladen nicht?

Browser speichern Favicons hartnäckig zwischen, oft über einen normalen Neuladevorgang hinaus. Versuchen Sie ein hartes Neuladen, öffnen Sie die Icon-Adresse direkt, oder schauen Sie in einem privaten Fenster. Es ist fast immer der Zwischenspeicher und keine kaputte Datei.

Sollte ich stattdessen ein SVG-Favicon nehmen?

SVG-Favicons werden gut unterstützt und skalieren perfekt, sie sind also eine gute erste Wahl, wenn Sie saubere Vektorgrafik haben. Sie wollen trotzdem eine .ico und ein Apple-Touch-Icon als Rückfall, und genau das liefert dieser Satz.

Helfen Sie, dieses Tool zu verbessern

Einen Fehler gefunden, eine Änderung im Kopf, oder fehlt Ihnen ein Tool?

/favicon-generator

↑↓ bewegen · Enter öffnen · Esc schließen