DE

Favicon erstellen

Erstelle alle Icons, die eine Website braucht, aus einem Bild oder ein paar Buchstaben: favicon.ico, PNG-Größen, das Apple Touch Icon und Android-Icons, dazu den HTML-Code zum Einfügen.

Deine Dateien bleiben auf deinem Gerät. Alles läuft in deinem Browser.

So funktioniert es

  1. Quelle wählenEin Bild oder SVG-Logo, oder ein bis drei Buchstaben.
  2. Aussehen anpassenHintergrundfarbe, Form und Innenabstand; prüf die Tab-Vorschau.
  3. Paket herunterladenEntpacke es im Hauptverzeichnis deiner Website und füge den HTML-Code in den head ein.

Alles, was ein Browser verlangt

Browser, Handys und Suchmaschinen suchen nach unterschiedlichen Icon-Dateien: favicon.ico für alte Browser und Windows, kleine PNGs für Tabs, ein Apple Touch Icon mit 180 Pixeln für den iPhone-Home-Bildschirm und Icons mit 192 und 512 Pixeln für Android und installierte Web-Apps. Der Generator zeichnet jede Größe einzeln, damit die 16-Pixel-Version scharf bleibt und keine verschwommene Verkleinerung der großen ist.

Das Apple-Icon bekommt einen festen Hintergrund, weil iOS Transparenz mit Schwarz füllt. Im Paket sind außerdem site.webmanifest und eine Textdatei mit den HTML-Zeilen.

Gute Favicons sind einfach

Bei 16 Pixeln verschwinden Details. Nimm ein kräftiges Symbol oder ein bis zwei Buchstaben mit starkem Kontrast und wenig Innenabstand, und prüf sowohl die helle als auch die dunkle Tab-Vorschau.

Häufige Fragen

Wohin kommen die Dateien?

In das Hauptverzeichnis deiner Website, neben die index.html. Danach fügst du den HTML-Code in den head-Bereich ein.

Kann ich ein SVG-Logo verwenden?

Ja. SVG-Dateien werden in jeder Größe scharf gezeichnet.

Werden meine Dateien hochgeladen?

Nein. Alles wird in deinem Browser erstellt.