SVG Vektorgrafiken ins ICO Dateiformat konvertieren
Meine Logos und Schriftzüge liegen im .svg (Scalable Vector Graphics) Format vor, dem vom W3C empfohlenem Format für Vektorgrafiken. Das tolle an Vektorgrafiken ist, das diese nicht aus Pixeln bestehen, sondern eben aus Vektoren. Das heißt man kann aus einem SVG zum Beispiel ein 100×100 PNG machen, oder auch ein 1000×1000 ohne ein unscharfes / pixeliges Bild zu erhalten.
Eine gute Webseite braucht aber nicht nur ein Logo, sondern auch ein “Favicon” – ein kleines Bild, welches m Browser auf dem Tab angezeigt wird. Leider unterstützt zum Zeitpunkt zu dem dieser Artikel geschrieben wurde lediglich Firefox ein SVG als Favicon (siehe Bild).
Das am weitesten verbreitetste und verwendetste Format für Favicons ist eben ICO. Moderne Browser unterstützen zwar auch PNG und GIF, aber der Vorteil von ICO ist, das dieses Format mehrere Größen eines Bildes aufnehmen kann. Damit hat man die passende Größe fürs Favicon (32×32) und auch gleich eine für die Verknüpfung am Smartphone (welche bei 32×32 sehr verpxielt aussehen würde).
Als ich mich also auf die Suche nach einem möglichst einfachen Online Tool machte, um mein SVG in ein ICO umzuwandeln, wurde ich schnell enttäuscht. Viele Converter-Tools unterstützen SVG gar nicht, und die die es unterstützen, machen aus den durchsichtigen Flächen weiße Flächen.
Die Lösung
Daher habe ich mir kurzerhand ein eigenes Tool geschrieben, um .svg Dateien in .ico umzuwandeln. Auf https://icon-converter.ml ist das Tool erreichbar. Es werden alle gängigen Formate unterstützt, unter anderem:
- SVG
- PNG
- JPG
- BMP
- GIF
- … und viele mehr
Als Ausgabe erhält man ein .ico File welches Dursichtigkeit unterstützt (Opacity support) und folgende Auflösungen enthält:
- 16×16
- 32×32
- 48×48
- 64×64
- 128×128
- 256×256
Die Umwandlung funktioniert ganz einfach in 3 Schritten:
- Bild auswählen
- Bild überprüfen und zur Konvertierung freigeben
- Fertig konvertiertes .ico File herunterladen
Das Icon ist dann für mindestens 2 Wochen von der Seite abrufbar.
Hier nochmal die Adresse unter welcher der Service auffindbar ist: