SVG-zu-PNG-Konverter

So wird es benutzt 3 Schritte
  1. Drücken Sie SVG-Datei auswählen oder fügen Sie das Markup ein.
  2. Legen Sie die Ausgabegröße und eine optionale Hintergrundfarbe fest.
  3. Drücken Sie In PNG umwandeln und laden Sie das Ergebnis herunter.
Vollständig in deinem Browser verarbeitet. Nichts wird hochgeladen.

Das SVG wird in der gewählten Größe auf ein Canvas gezeichnet; das Ergebnis ist damit so scharf, wie es der Vektor bei dieser Auflösung zulässt. Nur per Namen referenzierte Schriften und Bilder von anderen Websites können beim Rendern aus Sicherheitsgründen nicht geladen werden – wandeln Sie Text in Pfade um und betten Sie Bilder als Daten-URIs ein, falls etwas fehlt.

So funktioniert dieses Werkzeug

Ein SVG beschreibt Formen, ein PNG beschreibt Pixel. Umwandeln heißt, eine Größe zu wählen und den Browser den Vektor darin zeichnen zu lassen — die Ausgabegröße ist deshalb eine Entscheidung und keine Eigenschaft der Datei: Dasselbe SVG kann ein Symbol von sechzehn Pixeln oder ein Banner von viertausend ergeben, ohne Verlust in beide Richtungen, weil jedes Mal aus den Formen gezeichnet wird.

Die Maße werden aus Breite und Höhe des SVG gelesen, ersatzweise aus seiner viewBox und schließlich aus einem Rückfallwert von dreihundert Pixeln. Von dort legen Sie die Ausgabegröße fest, und alles skaliert mit. Alles jenseits von achttausend Pixeln je Seite wird abgelehnt, denn der Speicherbedarf wächst mit der Fläche, und ein Browser-Tab scheitert schlicht, statt eine Datei zu liefern.

Was die Umwandlung nicht übersteht

  • Die Skalierbarkeit ist das, was Sie aufgeben: Genau darum geht es bei einem SVG. Wandeln Sie nur dort um, wo wirklich ein Rasterbild verlangt wird — eine Social-Vorschau, eine E-Mail, ein Favicon, eine Plattform, die keine Vektoren annimmt.
  • Externe Verweise werden nicht geladen: Ein SVG, das auf eine Bilddatei, ein Stylesheet oder eine anderswo gehostete Schrift verweist, wird ohne diese gezeichnet. Alles muss im Markup stehen, um im PNG zu erscheinen.
  • Schriften müssen in Pfade umgewandelt sein: Text in einem SVG hängt davon ab, dass die Schrift beim Zeichnen verfügbar ist. Wandeln Sie Text vor der Konvertierung in Pfade um, sonst rechnen Sie mit einer Ersatzschrift.
  • Exportieren Sie in der Nutzungsgröße oder größer: Ein nachträglich vergrößertes PNG ist weich. Zwei- bis dreifache Anzeigegröße deckt hochauflösende Bildschirme ab, ohne erneut umwandeln zu müssen.

Shapes to pixels, and the size becomes a decision

An SVG describes shapes. A PNG describes pixels. Converting means choosing a size and having the browser draw the vector at it.

That is why the output size is a decision rather than a property of the file. The same SVG produces a sixteen-pixel favicon or a four-thousand-pixel banner with no loss either way, because the drawing happens from the shapes each time rather than by scaling an existing raster.

The [msm_tool slug="svg-to-png"] reads the dimensions from the SVG's own width and height, falls back to its viewBox when those are missing, and to 300 pixels when there is neither.

What silently does not survive

Two things go missing without any error, which makes them worth knowing in advance.

External references do not load. An SVG pointing at an image file, a stylesheet or a font hosted elsewhere is drawn without them. Everything must be inside the markup to appear in the PNG. A graphic that looks complete in your editor — which has access to those files — can convert with pieces missing.

Fonts must be outlined. Text in an SVG relies on the font being available while it is drawn. If it is not, the browser substitutes something else, and you get a PNG with the right words in the wrong typeface. Convert text to paths in your editor before converting the file. This is the commonest complaint about SVG conversion anywhere, and it is not specific to this tool.

Export larger than you need

A PNG enlarged afterwards is soft; there is no way back. Exporting at two or three times the display size covers high-density screens without a second conversion, and the only cost is file size.

For a logo used at 200 pixels wide, export at 400 or 600. For a favicon, generate each size from the SVG rather than downscaling one large PNG — small sizes drawn from the vector are noticeably sharper.

The size cap

Anything beyond 8,000 pixels a side is refused. The memory a canvas needs grows with the area, so doubling both dimensions quadruples it, and past a certain point a browser tab fails rather than producing a file.

Refusing is more useful than attempting and crashing. If you genuinely need something larger, that is a job for a desktop tool with access to real memory.

Keep the SVG as the master

The scalability is the thing you are giving up, and it is the entire point of the format. Convert only where a raster is genuinely required:

  • Social link previews, which mostly reject SVG.
  • Email, where SVG support is poor and inconsistent.
  • Favicons, at least for the ICO sizes.
  • Platforms and marketplaces that only accept raster uploads.
  • Anywhere the SVG would be inlined and you would rather not accept the security surface.

For anything on your own site, the SVG is usually both sharper and smaller. A logo as an SVG is a few kilobytes and perfect at every size; the same logo as a PNG set is several files and never quite right on an unusual display.

Transparency

PNG preserves it, so an SVG with no background produces a PNG with a transparent one. If you need a solid background, add a rectangle in the SVG before converting rather than relying on whatever ends up behind it — a transparent PNG on an unexpected dark background is a common surprise in email and on social platforms.

A quick checklist

  1. Text converted to paths.
  2. No external image, font or stylesheet references.
  3. A viewBox present, so the fallback sizing is sensible.
  4. Exported at two to three times the display size.
  5. Checked against both a light and a dark background if it is transparent.

Häufig gestellte Fragen

Speziell zum SVG-zu-PNG-Konverter. Allgemeinere Fragen zu dieser Kategorie werden auf der Kategorieseite beantwortet.

Mindestens in der Anzeigegröße und zwei- bis dreifach für hochauflösende Bildschirme. Größer kostet nur Dateigröße; kleiner lässt sich nicht rückgängig machen.
Die Schrift war beim Zeichnen des SVG nicht verfügbar. Wandeln Sie den Text in Ihrem Editor vor der Konvertierung in Pfade um.
Sie verwies mit ziemlicher Sicherheit auf etwas Externes — ein Bild, ein Stylesheet, eine Schrift. Gezeichnet wird nur, was im Markup steht.
Alles über achttausend Pixel je Seite wird abgelehnt. Der Speicherbedarf wächst mit der Fläche, und darüber scheitert ein Browser-Tab, statt eine Datei zu liefern.
Nur dort, wo kein Vektor angenommen wird. Behalten Sie das SVG als Original — es bleibt in jeder Größe scharf und ist meist die kleinere Datei.

Abonniere Benachrichtigungen zu neuen Tools, Funktionen und Produktivitätstipps.