So wandeln Sie SVG in ein Favicon um

Wählen Sie Ihr SVG-Logo.
Fügen Sie bei Bedarf Innenabstand, Ecken oder Hintergrund hinzu (gilt für PNG und ICO).
Laden Sie die ZIP-Datei herunter. Sie enthält favicon.svg (Ihr Original), favicon.ico und alle PNG-Größen.
Laden Sie die Dateien ins Hauptverzeichnis und fügen Sie den HTML-Code ein – die SVG-Zeile ist schon dabei.

Warum ein SVG-Favicon?

Immer scharf. Ein SVG passt sich jeder Größe und jedem Bildschirm an.
Winzige Datei. Ein einfaches Logo hat oft unter 1 KB.
Dunkelmodus. Mit einer prefers-color-scheme-Abfrage im SVG wechselt das Icon im dunklen Design die Farbe.

Chrome, Edge, Firefox und aktuelle Safari-Versionen unterstützen SVG-Favicons. Ältere Browser suchen nach favicon.ico, deshalb enthält der Download beides.

Häufige Fragen

Brauche ich favicon.ico trotz SVG?

Ja, als Rückfallebene. Der HTML-Code nennt das SVG zuerst, moderne Browser verwenden also das SVG.

Mein SVG bleibt leer.

SVGs, die externe Schriften oder Bilder laden, können nicht gezeichnet werden. Wandeln Sie Text in Pfade um und betten Sie Bilder ein.