Montag, 9. März 2020
Gestern die (viel zu späte) Idee: Anstelle popelige Logos in den Bitmap-Formaten PNG oder — Gott bewahre — GIF in eine Web-Applikation einzubinden, könnte man ja eigentlich 2020 auch SVGs verwenden. Denn die sehen dann auch auf einem Retina iMac blendend aus.
Glücklicherweise findet man auf Wikipedia sehr viele Unternehmens-Logos im SVG-Format herunterladbar. Ich habe mir also die gewünschten Logos heruntergeladen und in die Web-Applikation eingebunden. Transparenz, Farbverläufe, hochauflösend — alles perfekt.
Ausser bei einem SVG-Logo (dieses ausnahmsweise nicht von Wikipedia), welches partout mit einem weissen Hintergrund daherkommt: Gefunden habe ich das TWINT-Logo auf weissem Hintergrund auf der Web-Site von Zubi Schuhe.
Um den Hintergrund wegzubekommen evaluierte ich verschiedenste Wege:
- Online Vektor-Editor (SaaS): Mit Vector Paint – SVG Editor hätte es eigentlich geklappt, doch beim Export (Download) wurden die Farbverläufe zerschossen.
- Native macOS-Applikation: macSVG läuft unter macOS High Sierra nicht
- OSS Vektor-Applikation (Adobe Illustrator-Ersatz): Inkscape benötigt eine funktionierende Installation von XQuartz
Dann die letzte Hoffnung: SVG ist ja im Grunde ein XML-Format … was, wenn ich versuche, die Datei in Atom zu öffnen, das Hintergrund-Element zu finden und von Hand zu löschen?
Gesagt, getan. Und ich hätte mir fast die Haare ausreissen können: Es waren null Handstände nötig, denn der Hintergrund wird als Rechteck zu Beginn des SVGs definiert:
<rect width="100%" height="100%" fill="#fff" ry="15"/>
Die Anpassung bestand deshalb nur daraus, den Hex-Farbwert für Weiss — #fff — mit none zu ersetzen:
<rect width="100%" height="100%" fill="none" ry="15"/>
Fertig! (Ja, im Grund könnte man eigentlich auch die ganze Zeile löschen …)