Ein SVG ist ein Vektor: Es beschreibt eine Grafik mit Mathematik statt mit Pixeln und skaliert daher verlustfrei auf jede Größe. Ein PNG ist ein Raster: ein festes Gitter aus Pixeln. SVG in PNG umzuwandeln — „Rastern” genannt — bedeutet, diese unendlich skalierbaren Pfade in eine bestimmte Anzahl Pixel zu überführen. Die wichtigste Entscheidung dabei ist, in welcher Größe gerendert wird, denn das entscheidet, ob dein PNG scharf oder unscharf aussieht.
Warum du eine Größe wählen musst
Ein Foto hat eine natürliche Auflösung, ein SVG nicht. Beim Export nach PNG muss irgendetwas die Pixelmaße festlegen. Nutzt ein Tool einfach die eingebauten width/height-Werte des SVG — bei Icons oft winzig, etwa 24×24 —, bekommst du ein kleines, weiches PNG. Wähle von vornherein eine größere Ausgabebreite, und derselbe Vektor rendert gestochen scharf bei 512, 1024 oder 2048 Pixel. Genau das steckt hinter Suchanfragen wie „svg to png in hoher Qualität”.
Welche Auflösung passt
| Anwendung | Empfohlene Breite |
|---|---|
| Favicon, kleines UI-Icon | 256–512 px |
| Blogbild, App-Asset | 1024 px |
| Druck, großes Banner, große Grafik | 2048 px oder mehr |
Größer ist schärfer, ergibt aber eine größere Datei. Im Zweifel in doppelter Anzeigegröße rendern — Displays mit hoher Pixeldichte (Retina, die meisten Smartphones) belohnen die Extra-Details.
PNG, JPG oder WebP?
- SVG in PNG umwandeln — verlustfrei und mit Transparenz. Ideal für Logos, Icons und alles mit durchsichtigem Hintergrund.
- SVG in JPG umwandeln — kleinere Datei, aber keine Transparenz (leere Bereiche werden weiß). Gut für eine flache Illustration auf einfarbigem Hintergrund.
- SVG in WebP umwandeln — modernes Format, klein und mit Transparenz, ideal für Websites.
Hat dein SVG einen transparenten Hintergrund und du wandelst in JPG um, wird diese Transparenz weiß gefüllt — für den Erhalt also PNG oder WebP wählen.
Privat, direkt im Browser
Unsere Konverter rastern komplett auf deinem Gerät — das SVG wird nie hochgeladen:
- Eine oder mehrere SVG-Dateien hineinziehen.
- Ausgabebreite wählen; die Höhe folgt automatisch dem Seitenverhältnis.
- Ergebnis herunterladen oder mehrere als ZIP bündeln.
Der umgekehrte Weg
Andersherum — ein Logo-PNG zurück in einen skalierbaren Vektor zu verwandeln — ist ein anderer Vorgang namens Nachzeichnen. Falls du das brauchst, siehe wie man PNG in SVG umwandelt: Dort steht, wann Vektorisieren gut funktioniert und wann nicht.
Text und dünne Linien scharf halten
Zwei Dinge ruinieren ein gerastertes SVG unbemerkt. Erstens Schriften: Verweist dein SVG auf eine Schrift, die der Renderer nicht hat, wird der Text still durch eine Ersatzschrift getauscht und das Layout verrutscht. Wandelst du den Text im Quell-SVG vor dem Rastern in Umrisse (Pfade) um, sehen die Buchstaben überall identisch aus. Zweitens haarfeine Striche: Ein 1px-Strich bei 24×24 wird bei 512 zu rund 21px und bleibt scharf — renderst du aber kleiner als die Anzeigegröße, muss der Browser eine Bitmap hochskalieren, und genau diese Unschärfe schiebt man dann dem Format in die Schuhe.
Kurz zum Thema DPI
Ein PNG speichert Pixel, keine Zoll, daher ist „DPI” am Bildschirm belanglos — ein 1024px-Bild ist 1024px, ob ein Tag 72 oder 300 sagt. Wichtig wird es nur beim Druck: physische Größe × Ziel-DPI = Pixel. Eine 4 Zoll breit gedruckte Grafik bei 300 DPI braucht 1200px, bei 150 DPI 600px. Rechne für den Druck also von der Endgröße zurück und exportiere mindestens so viele Pixel.
Häufige Fehler
- Das Tool die winzige eingebaute SVG-Größe nutzen lassen. Ein 24×24-Icon wird zu einem 24×24-PNG. Lege die Ausgabebreite immer selbst fest.
- Ein kleines PNG hochskalieren, statt das SVG neu zu rendern. Eine Bitmap zu vergrößern bringt Unschärfe; das Neurastern des Vektors in Zielgröße bleibt scharf.
- Ein transparentes SVG in JPG umwandeln. Die Transparenz wird weiß gefüllt. Zum Erhalt SVG in PNG oder WebP nutzen.
FAQ
Warum hat mein exportiertes PNG einen weißen Hintergrund? Entweder hat das SVG selbst ein Hintergrundrechteck, oder du hast in ein Format ohne Transparenz exportiert. Ein echt transparenter Export braucht PNG oder WebP.
Mein PNG ist riesig — wie verkleinere ich es? Rendere nur so groß wie nötig und schick es dann durch eine Bildkomprimierung, um die Dateigröße ohne sichtbaren Qualitätsverlust zu senken.
Zum grundsätzlichen Vergleich der Formate stellt das beste Bildformat fürs Web PNG, JPG und WebP nebeneinander; brauchst du gezielt Icons, siehe wie man ein Favicon erstellt.