SVG-zu-PNG-Konverter

Was ein SVG ist, und warum die Umwandlung in Pixel nur in eine Richtung geht

Ein SVG ist kein Bild. Es ist die Beschreibung eines Bildes — eine Liste von Formen, Pfaden, Farben und Text, jeweils mit Koordinaten, niedergeschrieben in einer Textdatei, die etwas anderes liest und daraus zeichnet. Ein JPG oder ein PNG ist das Gegenteil: ein Raster aus Pixeln, ein für alle Mal festgelegt, als die Datei geschrieben wurde. Dieser eine Unterschied steht hinter allem auf dieser Seite, auch hinter der einen Frage, die dieser Konverter Ihnen stellen muss und die die beiden anderen Konverter nie stellen.

• Es ist lesbarer Text. Öffnen Sie ein SVG in einem beliebigen Texteditor, und die Formen stehen ausgeschrieben vor Ihnen — so können Sie auch selbst nachsehen, welche Größe die Datei angibt und worauf sie verweist.
• Es hat überhaupt keine Auflösung. Dieselbe Datei ist ein gestochenes Symbol in der Größe eines Punktes und ebenso ein gestochenes Plakat an der Wand, weil die Zeichnung von dem, was sie anzeigt, jedes Mal neu ausgerechnet und nirgends abgelegt wird.
• Gut ist es in flacher Grafik — Logos, Symbole, Schaubilder, Diagramme, Karten, alles Gezeichnete statt Fotografierte. Hoffnungslos ist es bei einer Fotografie, die keine Formen zum Beschreiben hat und für jedes Pixel eine Zeile der Datei bräuchte.
• Eines in Pixel umzuwandeln ist das, was diese Seite tut, und der Grund dafür ist fast immer eine Stelle, die das Format nicht annimmt: ein Hochladeformular, ein älteres Bildbearbeitungsprogramm, eine Dokument- oder Folienvorlage, die Vorschau in einem sozialen Netzwerk, eine E-Mail, ein Druckdienst.

Es in ein PNG zu verwandeln legt die Zeichnung in Pixeln einer einmal gewählten Größe fest, und das ist eine Tür, die sich nur in eine Richtung öffnet. Die Formen stecken nicht im Ergebnis, und keine Einstellung hier bewahrt sie: Das PNG hinterher zu vergrößern vergrößert also seine Pixel und zeichnet nichts neu, und diese Seite schreibt überhaupt kein Vektorformat — ein Bild wieder in Formen zu verwandeln ist eine andere Aufgabe mit anderen Antworten und nicht die Umkehrung dieser hier. Behalten Sie deshalb das SVG. Was Sie hier herunterladen, ist eine Kopie für einen Zweck und eine Größe, und der Weg zu einer zweiten Größe führt über eine erneute Umwandlung des Originals und nicht über das Skalieren dessen, was Sie schon haben.

Woher die Größe in den Feldern stammt

Weil ein Vektor keine eigenen Pixel hat, muss irgendetwas entscheiden, mit wie vielen er herauskommt, und diese Seite beginnt damit, zu lesen, was die Datei selbst nahelegt. Diese Zahl steht in den Feldern für Breite und Höhe, und ein Satz daneben nennt die Datei und sagt, welchem von genau drei Orten die Zahl entnommen ist. Es lohnt sich, ihn vor dem Umwandeln zu lesen, denn die drei sind nicht gleich vertrauenswürdig, und nur Sie wissen, welchen Sie gemeint haben.

• Die Datei nennt eine eigene Größe, in Pixeln. Das ist der stärkste der drei Fälle: Jemand, der die Zeichnung exportiert hat, hat gesagt, wie groß sie sein soll, und die Felder geben das schlicht wieder.
• Die Datei gibt ihre Größe in physischen Einheiten an — Zoll, Zentimeter, Millimeter, Punkt oder Pica — und sie ist mit sechsundneunzig Pixeln pro Zoll umgerechnet worden, was das Web unter einem Zoll versteht und keine Messung Ihres Bildschirms ist. Eine für den Druck vorbereitete Zeichnung kommt oft so an, und die Pixelgröße, die dabei herauskommt, ist die getreue Umrechnung einer Zahl, in der von Pixeln nie die Rede war.
• Die Datei nennt überhaupt keine brauchbare Größe, deshalb ist die Größe stattdessen aus ihrer viewBox gemessen. Das ist der Fall, den man zweimal ansehen sollte: Eine viewBox ist das Koordinatensystem, in dem die Formen gezeichnet sind, und keine Größe, die jemand gewählt hat, weshalb ein Symbol, dessen Koordinaten von null bis vierundzwanzig laufen, darum bittet, ein Bild in der Größe eines Punktes zu werden. Symbolsätze werden außerdem häufig mit einer Breite und einer Höhe in Prozent geschrieben, was die Größe von etwas ist, das diese Datei nicht hat, und deshalb als gar keine Größe gelesen wird — auch die landen hier.

Welcher der drei Orte auch geantwortet hat: Die Zahl wird einmal auf ganze Pixel gerundet, in dem Augenblick, in dem sie gelesen wird, denn eine Zeichenfläche wird in ganzen Pixeln angelegt und für einen Bruchteil ist darin kein Platz. Für eines ist das besonders wichtig: Alles Weitere rechnet mit der gerundeten Zahl, die Sie sehen, und nicht mit dem Bruch dahinter, deshalb ist das Doppelte einer als einunddreißig Pixel breit angezeigten Zeichnung zweiundsechzig und nicht die dreiundsechzig, die eine zweite Rundung ergäbe. Die Größe auf dem Bildschirm und die Größe, mit der gerechnet wird, sind dieselbe Größe, und nur so bedeuten die Felder, was sie sagen.

Die Größe wählen, die Sie brauchen — und die Zeichnung, die keine nennt

Die Größe, die die Datei nahelegt, ist immer nur ein Ausgangspunkt, und sie wird als solcher angeboten und nicht auferlegt. Alles an den beiden Feldern ist so eingerichtet, dass der gewöhnliche Fall kein Nachdenken kostet und der genaue Fall trotzdem erreichbar bleibt, und darin besteht der ganze Unterschied zwischen dieser Seite und ihren beiden Geschwistern — eine Fotografie wird in der Größe umgewandelt, die sie ohnehin hat, und es gibt nichts zu entscheiden.

• Tippen Sie eine Breite ein, folgt die Höhe, und tippen Sie eine Höhe ein, folgt die Breite, sodass die Zeichnung ihr Seitenverhältnis behält, ohne dass Sie etwas ausrechnen müssen. Das ist die Voreinstellung, weil ein versehentlich verzerrtes Logo genau der Fehler ist, den man unmöglich machen sollte.
• Nehmen Sie den Haken bei der Beibehaltung des Seitenverhältnisses heraus, wenn Sie wirklich eine genaue Fläche brauchen — einen Bannerplatz, ein festes Profilbild, ein Symbolblatt —, und die beiden Felder werden voneinander unabhängig. Die Zeichnung wird dann auf das gedehnt, was Sie verlangt haben, was genau das Gewünschte ist und zugleich der Grund, warum es eine bewusste Handlung und nicht die Voreinstellung ist.
• Die Reihe der Faktoren ist der schnelle Weg zu den Größen, die Menschen wirklich wollen, und jeder von ihnen wird an der Größe gemessen, die die Datei nennt, und nicht an dem, was in diesem Augenblick in den Feldern steht. Denselben Faktor zweimal zu drücken gibt Ihnen deshalb zweimal dieselbe Antwort, statt sich zu etwas aufzuschaukeln, das Sie nicht verlangt haben.
• Ein Faktor ohne Antwort wird als nicht verfügbar angeboten und nicht als Schaltfläche, die nichts tut. Eine ohnehin schon riesige Zeichnung zu vervielfachen kann eine Größe erreichen, die kein Bildformat ausdrücken kann, und ein Bedienelement, das stillschweigend ablehnt, wäre schlimmer als eines, das Ihnen zeigt, dass es nicht kann.

Dann gibt es die Datei, die gar nichts nennt: keine Breite und Höhe, die dieses Werkzeug lesen kann, und auch keine viewBox zum Messen. Das kommt häufiger vor, als es klingt — eine Zeichnung, die direkt aus manchen Programmen kommt, oder eine von Hand für eine Seite geschriebene, deren Größe später mit CSS festgelegt werden sollte. Es steckt wirklich keine Größe darin, deshalb öffnen sich die Felder leer, es erscheint kein Satz darüber, woher eine Zahl stammt, es gibt nichts zu vervielfachen und kein Seitenverhältnis zu bewahren, und die Zeile lehnt ab und bittet Sie um eine Breite und eine Höhe. Diese Ablehnung ist der Sinn der Sache und kein Versagen: Ein Browser, dem man eine solche Datei gibt, fällt auf eine kleine feste Fläche zurück, die niemand gewählt hat, und einmal gefragt zu werden ist besser, als diese herunterzuladen und es später zu bemerken.

Ein Paar, das keine Größe ist, wird mit eigenen Worten abgelehnt, und das ist die andere Hälfte derselben Sorgfalt. Null, eine negative Zahl, ein halbes Pixel oder eine Zahl, die größer ist, als ein Bildformat ausdrücken kann, werden jeweils abgelehnt, statt gerundet, gekappt oder stillschweigend durch die eigene Größe der Datei ersetzt zu werden — eine Umwandlung in einer Größe, die niemand verlangt hat, ist genau das, wozu es diese Seite nicht gibt. Und wenn das, was Sie gewählt haben, eine Fotografie statt einer Zeichnung ist, erscheinen die Größenfelder überhaupt nicht: Ein Pixelbild wird in seinen eigenen Abmessungen umgewandelt, und ein Bedienelement, das nichts ändern könnte, ist schlimmer als gar keines.

In welches Format umgewandelt werden soll

Diese Seite öffnet mit PNG, weil das für fast jeden Vektor die richtige Antwort ist, und die anderen Formate sind einen Klick entfernt statt hinter einer weiteren Seite. Sie wählen zwischen einem Format, das die Pixel exakt ablegt, und zweien, die einen Teil davon gegen eine kleinere Datei eintauschen, und eine Zeichnung ist dabei ein ungewöhnlich einseitiges Beweisstück: Flächige Farbe und harte Kanten sind genau der Inhalt, mit dem verlustbehaftete Kompression am schlechtesten umgeht.

• PNG ist die Voreinstellung und meist auch das Ende der Erörterung. Es legt die in Pixel umgewandelte Zeichnung exakt ab, es trägt Transparenz, und es komprimiert gleichmäßige Flächen einer Farbe außerordentlich gut — und genau das ist ein Logo oder ein Symbol größtenteils, weshalb die Datei oft kleiner ausfällt, als der Ruf des Formats vermuten lässt.
• JPG lohnt sich nur, wenn etwas am anderen Ende darauf besteht. Es kann Transparenz überhaupt nicht ablegen, deshalb muss zuerst eine Hintergrundfarbe hinter Ihre Zeichnung gemalt werden, und seine Kompression legt einen grauen Saum genau an die scharfen Kanten und Buchstaben, für deren Erhalt Sie den Vektor umgewandelt haben.
• WebP ist die mittlere Antwort für eine Webseite: Es trägt Transparenz und ist meist kleiner als das PNG. Es ist hier bei jeder Qualitätseinstellung verlustbehaftet, das obere Ende des Reglers eingeschlossen, es ist also eine gute Wahl für ein Bild, das auf eine Seite geht, und eine schlechte für eine Fassung, die Sie aufbewahren und noch einmal bearbeiten wollen.
• Keines der drei ist ein Vektorformat, und diese Seite schreibt kein Vektorformat. Wenn Sie eine beliebig skalierbare Datei brauchen, ist das SVG, das Sie schon haben, genau diese Datei — behalten Sie es, und betrachten Sie alles, was Sie hier herunterladen, als eine Kopie für einen einzigen Ort.

Der Qualitätsregler erscheint nur bei den beiden Formaten, die etwas herzugeben haben, also bei JPG und WebP; PNG wirft nichts weg, deshalb wird gar kein Regler angeboten statt eines, der dasteht und nichts tut. Jede Zeile nennt die Größe, mit der die Datei herausgekommen ist, sodass der Handel, den Sie eingehen, als Zahl vor Ihnen liegt. Eine Bewegung dieses Reglers kodiert, wo es geht, ein bereits gezeichnetes Bild neu, statt die Zeichnung noch einmal zu zeichnen, während eine Änderung der Größe sie sehr wohl neu zeichnen muss — und das ist die richtige Reihenfolge, denn die zweite ist diejenige, die wirklich andere Pixel hervorbringt.

Was eine Umwandlung in Pixel nicht mitnehmen kann

Alles hier geschieht mit den Zeichenfunktionen, die ohnehin in Ihrem Browser stecken: Die Datei wird ihm als Bild übergeben, einmal in der von Ihnen gewählten Größe gezeichnet und in dem Format zurückgeschrieben, das Sie verlangt haben. Das ist es, was das Werkzeug ohne Hochladen, ohne Installieren und ohne einen Download über die Seite selbst hinaus arbeiten lässt — und bei einem Vektor entscheidet es zugleich, was im Ergebnis überhaupt stehen kann, denn ein SVG ist ein Dokument und kein Block aus Pixeln, und ein Dokument kann um Dinge bitten.

Übergeben, wie es hier übergeben wird, bekommt es sie nicht. Nichts in der Datei wird ausgeführt und nichts außerhalb der Datei wird geladen, und das ist eine bewusste und wirklich wertvolle Eigenschaft: Ein SVG kann ein Skript enthalten, und es kann einen Verweis auf eine Adresse irgendwo tragen, die in dem Augenblick abgerufen würde, in dem die Zeichnung angezeigt wird. Die Zeichnung eines Fremden hier zu öffnen tut weder das eine noch das andere. Was diese Sicherheit kostet, steht unten, und die ersten beiden Punkte werden in der Zeile genannt, statt Ihnen zum Bemerken überlassen zu werden.

• Alles, worauf die Datei außerhalb ihrer selbst verweist, wird nicht geladen — ein verknüpftes Bild, ein Stylesheet, eine Schrift. Das gilt für eine Adresse im Web und ebenso für eine Datei, die im selben Ordner liegt, was der bei weitem häufigere Fall ist und der Grund, warum der Hinweis sagt, dass diese Teile nicht geladen werden, statt zu sagen, sie lägen auf einem entfernten Rechner. Wofür sie gedacht waren, fehlt im Ergebnis, und die Abhilfe besteht darin, sie in die Zeichnung einzubetten und noch einmal umzuwandeln.
• Text wird mit den auf diesem Rechner installierten Schriften gezeichnet. Die Buchstaben stehen im Ergebnis und sehen für Sie richtig aus, aber dieselbe Datei kann auf einem anderen Computer eine andere Schrift wählen und ein anderes Bild ergeben. Wenn es auf die genauen Formen ankommt, wandeln Sie den Text in dem Programm, das die Datei gezeichnet hat, in Pfade um — dann wird überhaupt nichts mehr nachgeschlagen.
• Alles, was die Zeichnung im Lauf der Zeit tut, steht nicht im Ergebnis. Die Ausgabe ist in jedem angebotenen Format ein unbewegtes Bild, deshalb steuert eine Datei, die sich selbst animiert, den einen gezeichneten Augenblick bei, und auch nichts Interaktives übersteht den Weg.

Zwei Obergrenzen der Ausgabe sollte man deutlich aussprechen, statt sie entdecken zu lassen. Das PNG schreibt der browsereigene Kompressor, der ordentlich, aber nicht erschöpfend arbeitet, sodass ein spezialisiertes Optimierungsprogramm noch eine Scheibe von der Datei abtragen könnte, ohne ein einziges Pixel zu ändern; und das WebP ist bei jeder Einstellung eine verlustbehaftete Kodierung, weil sich der verlustfreie Modus des Formats bei einem Browser überhaupt nicht anfordern lässt. Beide ließen sich anheben, indem man einen echten Kodierer mitliefert, der in der Seite läuft, und dieses Werkzeug tut das bewusst nicht — es wären einige hundert Kilobyte, die jeder Besucher herunterlädt, damit ein Teil von ihnen eine etwas kleinere Datei bekommt, auf einer Website, deren übrige Seiten in dem Moment funktionieren, in dem sie erscheinen. Auf dieser Seite im Besonderen brächte es zudem weniger, als es scheint: Die Umwandlung in Pixel ist das Zeichnen Ihres Vektors durch den Browser selbst, und ein Kodierer kann daran nichts ändern.

Was Ihnen jede Zeile über Ihre Zeichnung sagt, und wann sie ablehnt

Ein Konverter, der schweigend arbeitet, ist der Weg, auf dem jemand mit einem Logo auf schwarzem Grund endet oder mit einer Zeichnung, der das Bild fehlt, auf das sie verwiesen hat, und es Tage später und ganz woanders bemerkt. Jede Zeile hier trägt einen kurzen Bericht darüber, was mit dieser Datei tatsächlich geschehen ist — und trägt gar nichts, wenn nichts Bemerkenswertes geschehen ist, und genau das macht die Hinweise zu etwas, wofür man innehält. Ein Vektor trifft auf andere Hinweise als eine Fotografie, und drei der Hinweise des Werkzeugs können auf ihn überhaupt nicht zutreffen: Eine Zeichnung hat keine Kameradaten zu verlieren, nichts, was angibt, wie herum sie steht, und keine Einzelbilder, die abhandenkommen könnten.

• Etwas, worauf die Zeichnung verweist, wird nicht geladen. Der Hinweis erscheint bei einer Datei, die auf ein Bild, ein Stylesheet oder eine Schrift verweist, die nicht in ihr enthalten sind, sei es über eine Adresse oder über einen Pfad daneben, und er ist die Erklärung für ein Ergebnis, in dem ein Stück fehlt.
• Text wurde mit den Schriften dieses Rechners gezeichnet. Der Hinweis erscheint nur dort, wo die Zeichnung wirklich Buchstaben auf die Zeichenfläche setzt; eine Datei mit einem leeren Textelement sagt also nichts, und eine Zeichnung ganz ohne Text sagt ebenfalls nichts.
• Durchsichtige Stellen wurden gefüllt, und mit welcher Farbe. Eine Umwandlung nach JPG muss etwas hinter die Zeichnung setzen, und eine Farbauswahl erscheint, sobald eine Datei in Ihrer Liste sie wirklich braucht. Dieser Hinweis wird gemessen und nicht angenommen: Er wartet, bis im Gezeichneten wirklich ein durchsichtiges Pixel gefunden wurde, deshalb wird eine Zeichnung, deren eigene Grafik das ganze Bild bedeckt, nach JPG umgewandelt, ohne dass davon die Rede wäre.
• Der Name und der Inhalt widersprechen einander. Das Format wird am Inhalt der Datei entschieden und nie an ihrer Endung, deshalb wird eine Zeichnung, die jemand mit der falschen Endung gespeichert hat, als das SVG gelesen und richtig umgewandelt, das sie ist — und Sie erfahren davon, weil es etwas Wahres über Ihre Datei ist, das Sie vermutlich nicht wussten.
• WebP ist auch bei dieser Einstellung verlustbehaftet. Eine Zeichnung in Pixel umzuwandeln und dann das äußerste obere Ende des Qualitätsreglers zu verlangen fühlt sich an, als müsste genau das zurückkommen, was gezeichnet wurde, und das tut es nicht — eben dieser Glaube ist es, den der Hinweis richtigstellt, und darum erscheint er dort und an keiner niedrigeren Stelle.

Wo eine Datei überhaupt nicht umgewandelt werden kann, sagt das Werkzeug warum, statt etwas zu erzeugen. Eine Datei, die keines der von ihm gelesenen Formate ist, wird benannt und abgelehnt, und ebenso eine, die zwar eines davon ist, deren Anfang sich aber nicht lesen lässt — bei einer Zeichnung heißt das ihr öffnendes Tag, das Einzige, was ein Vektor an Kopfbereich hat. Eine Datei mit einer Zeichnung irgendwo mitten in einer Webseite ist keine Bilddatei und wird als solche abgelehnt, und ebenso eine Zeichnung, die Ihr Browser, wie sich herausstellt, nicht zeichnen kann, so unversehrt sie von außen auch aussah. Nichts wird geraten, und nichts Halbfertiges wird als fertig zurückgegeben.

Die Ablehnung, der Sie hier am ehesten begegnen, ist die zur Größe, und das ist eine Tatsache über diese Seite und nicht über Ihre Datei: Ein Vervielfacher ist einen Klick entfernt, eine Zeichnung lässt sich bereitwillig nach jeder beliebigen Größe fragen, und in einem Vektor steckt nichts, was Sie aufhielte. Auf hält Sie der Browser, der ein Bild nur bis zu einer bestimmten Fläche hält — auf einem Telefon eine andere Fläche als auf einem Desktop-Rechner, und zwischen zwei Browsern derselben Maschine wieder eine andere. Sie zu überschreiten erzeugt überhaupt keinen Fehler, nur ein leeres Bild von wenigen Kilobyte, das nach einer fertigen Umwandlung aussieht, bis man es öffnet. Deshalb schreibt dieses Werkzeug ein bekanntes Pixel in der gewünschten Größe ins Bild und liest es sofort zurück, noch ehe eine einzige Form gezeichnet ist; kommt es nicht zurück, bekommen Sie die Ablehnung mit der Größe darin und keine Datei. Nirgends wird irgendetwas mit einer festen Zahl verglichen, die Grenze, auf die Sie stoßen, ist also die Ihres eigenen Geräts und nie eine für jemand anderen gewählte.

Warum Ihre Zeichnung diesen Tab nie verlässt

Eine Zeichnung verrät mehr als eine Fotografie, denn eine Zeichnung ist eine Textdatei, und die lässt sich lesen. Die Namen der Ebenen, der Name dessen, der sie ausgegeben hat, ein Kommentar, den jemand darin hinterlassen hat, die Adresse jedes Stücks, auf das sie verwiesen hat — all das steht ausgeschrieben in der Datei, und nichts davon geht irgendwohin. Ihr SVG wird von diesem Browser-Tab gelesen und vom Prozessor Ihrer eigenen Maschine in Pixel umgewandelt. Am anderen Ende dieser Seite steht kein Server, der eines entgegennehmen könnte; das ist also eine Beschreibung dessen, woraus das Werkzeug gebaut ist, und kein Versprechen darüber, wie es betrieben wird.

Ein paar Sekunden im Netzwerk-Tab der Entwicklerwerkzeuge Ihres Browsers entscheiden die Sache, und bei einer Zeichnung gibt es zwei Dinge zu beobachten statt eines. Es geht nichts hinaus, das Ihre Datei trägt, und es geht auch nichts im Namen der Datei hinaus, wie viele Adressen auch immer in ihr stehen. Nach dem Laden ist die Seite eine Handvoll statischer Dateien, ohne dass anderswo Code liefe; Sie können das Netzwerk also vollständig trennen und so lange weiter in Pixel umwandeln, wie Sie mögen.

• Eine Zeichnung, die Sie keinem Fremden geben würden — ein noch nicht vorgestelltes Logo, ein Grundriss, das Schaubild von etwas Internem —, lässt sich hier in Pixel umwandeln, ohne dass sie Ihre Maschine überhaupt verlässt.
• Was aus der Umwandlung in Pixel hervorgeht, bleibt in diesem Tab, bis Sie es sichern, und den Tab zu schließen ist das ganze Löschen. Weder die mitgebrachte Zeichnung noch das daraus gemachte Bild wird von einem Besuch zum nächsten behalten.
• Eine Zeichnung, die von einer Stelle kam, der Sie nicht ganz trauen, lässt sich hier gefahrlos öffnen, weil nichts in ihr ausgeführt und nichts, worauf sie verweist, geladen wird. Sie in Pixel umzuwandeln ist zugleich eine Art, sie zu entschärfen: Was Sie herunterladen, sind Pixel, und Pixel können um nichts bitten.