SVG in PNG umwandeln — jede Größe, transparent
SVG in PNG, JPG oder WebP im Browser umwandeln, mit Maßstab oder Breite
Verarbeitung im Browser · kein Hochladen
SVG-Datei hierher ziehen
Wandeln Sie eine SVG-Datei (bis 10 MB) in PNG, JPG oder WebP um. Die Datei verlässt Ihren Browser nicht.
PNG und WebP behalten die Transparenz. Speichern Sie Symbole in 2–4×, damit sie auf hochauflösenden Bildschirmen scharf bleiben.
Was ist das?
Ein Konverter, der SVG-Vektorgrafiken in gewöhnliche Bilder wie PNG verwandelt. SVG bleibt in jeder Größe scharf, doch Messenger, Office-Programme, soziale Netzwerke und viele Upload-Formulare nehmen es nicht an. Wählen Sie einen Maßstab oder eine Breite, speichern Sie ein PNG und verwenden Sie es überall. Sie können eine Datei ablegen oder SVG-Code einfügen, die Transparenz bleibt erhalten.
So geht’s
- Wählen Sie Datei und legen Sie ein SVG ab, oder wählen Sie Code einfügen und fügen Sie Markup ein, das mit
<svg>beginnt. - Wählen Sie unter Format PNG, JPG oder WebP.
- Wählen Sie unter Größe 1× bis 4× oder geben Sie eine Breite in Pixeln ein.
- Behalten Sie den transparenten Hintergrund oder füllen Sie ihn mit einer Farbe. JPG wird immer gefüllt.
- Prüfen Sie die Vorschau und klicken Sie auf PNG speichern.
So funktioniert es
- Ursprungsgröße: width und height des Wurzelelements
<svg>(px, pt, mm, cm und in werden in CSS-Pixel umgerechnet); ist nur eines angegeben, ergibt sich das andere aus dem Verhältnis der viewBox. Prozentangaben gelten nicht als Größe. - Skalierung: width und height werden auf die Ausgabegröße gesetzt, und fehlt eine viewBox, wird sie aus der Ursprungsgröße ergänzt, sodass die ganze Zeichnung mitskaliert.
- Zeichnen: Der Browser zeichnet das SVG als Bild, das Ergebnis wird auf ein Canvas kopiert. In diesem Modus werden nie externe Dateien geladen und nie Skripte ausgeführt (die Sicherheitsregeln für SVG als Bild).
- Warnungen: Externe Verweise, Text (Schriften), foreignObject, Skripte und Animationen werden vorab gemeldet. Animationen werden mit ihrem ersten Bild gespeichert.
- Grenzen: 16.384 px pro Seite und 16.777.216 Pixel auf iPhone und iPad; größere Ausgaben werden verkleinert.
Beispiele
| SVG | Einstellung | Ergebnis |
|---|---|---|
| icon.svg (viewBox 0 0 24 24) | 4× PNG, transparent | icon.png 96×96, transparent |
| logo.svg (width 200, height 80) | Breite 1000 px | logo.png 1000×400 |
| chart.svg (ohne Größe) | 2× JPG, weiß | chart.jpg 600×300 |
Für einen kompletten Satz Website-Symbole nutzen Sie den Favicon-Generator; um das PNG in ein anderes Format zu bringen, den Bildkonverter.
Häufige Fragen
Welchen Maßstab soll ich wählen?
2× passt für die meisten Web-Symbole und Logos; für den Druck oder hochauflösende Bildschirme nehmen Sie 3× oder 4×. Für eine exakte Größe wählen Sie „Eigene Breite“, etwa 1024 px, die Höhe folgt dem Seitenverhältnis.
Nach dem Umwandeln sieht die Schrift anders aus.
Wenn ein SVG als Bild gezeichnet wird, laden Browser keine Schriftdateien außerhalb davon, Text erscheint also in den auf Ihrem Gerät installierten Schriften. Wandeln Sie den Text vorher in Illustrator, Figma oder Inkscape in Pfade (Konturen) um, damit das Design erhalten bleibt.
Ein Teil des Bildes fehlt.
Dateien, auf die das SVG an anderer Stelle verweist (Bilder oder CSS unter einer anderen Adresse), werden aus Sicherheitsgründen nicht geladen, diese Teile bleiben leer. Das Tool listet sie auf; betten Sie sie als data:-URIs in das SVG ein und versuchen Sie es erneut.
Was, wenn das SVG keine Größe hat?
Ohne width und height wird die Größe der viewBox verwendet, ohne beides der Browser-Standard von 300×150 px. Die Seite zeigt vor dem Anwenden des Maßstabs, welche Grundlage sie verwendet hat.
Wird mein SVG an einen Server gesendet?
Nein. Lesen und Zeichnen passieren beide in Ihrem Browser.
