Favicon-Generator

Verwandeln Sie eine PNG-, JPG- oder SVG-Datei in ein favicon.ico und alle Icon-Größen, die Ihre Website benötigt, verpackt in einer ZIP-Datei.

Nicht-quadratisches Bild

Das gesamte Bild bleibt sichtbar, zentriert mit einem Abstand darum herum.

Hintergrund

Transparent eignet sich für Browser-Tabs; für Icons auf dem iPhone-Home-Bildschirm ist eine Hintergrundfarbe sicherer.

Ihr Icon-Paket

Ihr Favicon und Icon-Paket werden hier angezeigt.

Bereit. Fügen Sie ein PNG, JPG oder SVG hinzu, um zu beginnen.

Ihr Bild wird direkt in Ihrem Browser in Icons umgewandelt. Es wird nichts auf BroBroGo hochgeladen.

FAQ

Welche Dateien sind im Icon-Paket enthalten?

favicon.ico mit Versionen in 16, 32 und 48 Pixeln, PNG-Icons in 16, 32, 180, 192 und 512 Pixeln sowie eine site.webmanifest, die die großen Icons auflistet. Wenn Sie mit einer SVG-Datei beginnen, ist auch die Vektordatei selbst enthalten. Eine ZIP-Datei enthält alles.

Welche Größe sollte mein Quellbild haben?

Eine SVG-Datei ist ideal – jedes Icon wird aus der Vektorgrafik generiert, sodass selbst 16 Pixel scharf bleiben. Bei PNG oder JPG sollten Sie mit mindestens 512 × 512 Pixeln beginnen; kleinere Bilder werden hochskaliert und können unscharf wirken.

Sollte der Hintergrund transparent sein oder eine Farbe haben?

Tab-Icons sehen transparent gut aus. Auf dem Home-Bildschirm von iPhone und iPad werden transparente Bereiche jedoch schwarz dargestellt – falls Nutzer Ihre Website zu ihrem Home-Bildschirm hinzufügen, wählen Sie lieber eine Hintergrundfarbe.

Was passiert mit einem Bild, das nicht quadratisch ist?

Icons sind quadratisch, aber Ihr Bild wird niemals verzerrt. Standardmäßig wird es zentriert mit einem Abstand (Padding) darum herum platziert; wechseln Sie zu „Ausfüllen (Zuschneiden)“, um stattdessen die überstehenden Ränder abzuschneiden.

Wohin gehören die Dateien auf meiner Website?

Laden Sie sie in das Stammverzeichnis Ihrer Website hoch, sodass favicon.ico unter /favicon.ico erreichbar ist, und fügen Sie dann die generierten Zeilen in den <head> Ihrer Seiten ein. Browser wählen automatisch die richtige Größe aus.