SVG-Logo in PNG umwandeln, in genau der richtigen Größe

PNG ist das Rasterformat, das SVG am nächsten kommt: verlustfrei, mit scharfen Kanten und transparentem Hintergrund, sodass das Logo auf jeder Farbe sauber wirkt.

Das PNG wird in der Größe gezeichnet, die das SVG angibt: über die Attribute width und height, ersatzweise über die viewBox. Unser eigenes Logo zeigt die Falle gut. Seine Datei gibt nur viewBox="0 0 32 32" an, also kam das PNG mit 32 × 32 Pixeln heraus: gut für einen Browser-Tab, unbrauchbar für eine Präsentation.

Die Lösung dauert eine Minute. Öffne das SVG in einem beliebigen Texteditor, such das öffnende <svg>-Tag und ergänze width und height im gleichen Verhältnis wie die viewBox, zum Beispiel width="512" height="512". Speichern und erneut umwandeln: Das Logo wird in der neuen Größe aus seinen Formen neu gezeichnet.

Wir haben unser 304 Byte großes Logo nach der Angabe von vier verschiedenen Größen umgewandelt. Jedes PNG wurde aus den Formen neu gezeichnet, deshalb hat selbst das größte perfekt saubere Kanten, und die Dateien bleiben klein, weil ein Logo fast nur aus Farbflächen besteht.

Auch das haben wir ausprobiert. In einem Bildprogramm auf 512 Pixel gestreckt, wurde das 32-Pixel-PNG zu einem weichen, unscharfen Quadrat: Das Programm kann die fehlenden Pixel nur erraten. Die aus dem SVG mit 512 Pixeln neu gezeichnete Version war gestochen scharf. Geh immer zurück zum SVG und wandle in der benötigten Größe um, statt ein vorhandenes PNG zu vergrößern.

SVG in WebP behält den transparenten Hintergrund und ergab eine kleinere Datei: 5,6 KB für das 512-Pixel-Logo gegenüber 11,7 KB als PNG, ideal für Websites. SVG in JPG funktioniert auch, aber JPG kennt keine Transparenz, der Hintergrund wird also weiß. Für den Druck wähle SVG in PDF: Das Logo bleibt eine Vektorzeichnung und ist in jeder Druckgröße scharf, unseres belegte 1,2 KB, egal welche Größe wir angegeben hatten.

Nutzt der Schriftzug eine Schrift, die weder eingebettet noch in Pfade umgewandelt ist, kann er mit einer ähnlichen Schrift gezeichnet werden. Gestalter wandeln Text vor der Übergabe eines Logos meist in Pfade um; sieht deines anders aus, frag nach einer Version mit Pfaden. Bilder, die das SVG von anderen Websites verlinkt, werden nicht geladen.

Wir haben die Logodatei verwendet, die diese Seite ausliefert, unverändert bis auf die ergänzte Breite und Höhe, und sie mit den SVG-Konvertern dieser Seite umgewandelt, die das Bild mit librsvg auf derselben Software zeichnen wie unsere Server. Die Dateigrößen deines Logos hängen von Farben und Details ab, die Regel gilt aber für jedes SVG: Die angegebene Größe bestimmt die Größe des PNG.