SVG zu PNG Konverter: Das kostenlose Tool, das Designer wirklich nutzen

Kurzes Szenario.

Sie haben ein Logo als SVG entworfen. Sauber, skalierbar, perfekt.

Jetzt möchte Ihr Kunde es auf einer PowerPoint-Folie haben. Oder als iOS-App-Symbol. Oder in 300 DPI für ein Banner gedruckt.

PowerPoint kommt mit SVG kaum zurecht. iOS benötigt PNG. Druck erfordert bestimmte DPI.

Sie brauchen einen SVG zu PNG Konverter, und zwar sofort.

In diesem Leitfaden zeige ich Ihnen das kostenlose Tool, das ich verwende und das CloudConvert und Adobe übertrifft, plus die 6 Export-Voreinstellungen, die jeder Designer kennen sollte.

Warum die Konvertierung von SVG zu PNG wichtig ist#

SVG ist die Zukunft für das Web. Unendlich skalierbar, winzige Dateigröße, barrierefreundlich.

Aber der Rest der Welt verwendet immer noch Rastergrafiken:

• iOS App-Symbole: PNG erforderlich (bestimmte Größen)
• PowerPoint / Keynote: PNG für zuverlässige Anzeige
• E-Mail-Marketing: SVG-Unterstützung ist lückenhaft; PNG ist universell
• Druck: benötigt bestimmte DPI (normalerweise 300 für hohe Qualität)
• Soziale Medien: die meisten Plattformen bevorzugen PNG/JPG
• Altsysteme: SVG oft nicht unterstützt

Also müssen Sie konvertieren. Oft.

Was ein großartiger SVG-zu-PNG-Konverter leistet#

Meine Checkliste:

1. Individuelle DPI, 96 (Web), 192 (2x Retina), 288 (3x), 384 (4x), 300 (Druck)
2. Auflösungsvorgaben, 1080p, 4K, Instagram-Quadrat, Open Graph, PWA-Symbol
3. Transparente oder einfarbige Hintergründe, für Web- und Druckanforderungen
4. Stapelverarbeitung, konvertieren Sie Dutzende SVGs auf einmal
5. Mehrere Ausgabeformate, PNG, JPG, WebP
6. Nur im Browser, Ihre SVGs werden nicht auf einen Server hochgeladen

Die meisten "kostenlosen" Online-Konverter scheitern an mindestens 3 dieser Punkte.

Der kostenlose Konverter, den ich nutze#

Molixa SVG zu PNG Konverter.

Alle sechs. Kostenlos. Kein Wasserzeichen. Stapelverarbeitung möglich. Erzeugt automatisch Retina-Suffixe (@2x, @3x) für iOS/Android-Workflows.

Die 6 Export-Vorgaben, die jeder Designer braucht#

Wenn Sie konvertieren, zielen Sie auf einen bestimmten Anwendungsfall ab. Hier sind die sechs, die ich wöchentlich nutze.

Vorgabe 1: Web-Standard (96 DPI, 1x)#

Für: normale Web-Bilder, Blogbeitragsgrafiken, einfache Symbole.

Größe: tatsächliche SVG-Maße, keine Hochskalierung.

Vorgabe 2: Retina (192 DPI, 2x)#

Für: Web-Bilder auf Retina-Displays (Macs, iPhones, moderne Android-Geräte).

Größe: 2x die SVG-Maße. Sieht auf HiDPI-Bildschirmen gestochen scharf aus.

Vorgabe 3: 3x mobil (288 DPI, 3x)#

Für: iOS-/Android-Apps auf Plus-Telefonen, Pro Max-Geräten.

Größe: 3x. Standard in mobilen Entwicklungs-Workflows.

Vorgabe 4: Druckqualität (300 DPI)#

Für: Poster, Visitenkarten, Broschüren, alles Gedruckte.

Größe: abhängig von der physischen Druckgröße. 300 DPI ist der Industriestandard für Druck.

Vorgabe 5: Open Graph (1200x630)#

Für: Social-Media-Link-Vorschauen. LinkedIn, Twitter und Facebook nutzen alle dieses Seitenverhältnis.

Vorgabe 6: PWA-Symbol (512x512)#

Für: Progressive-Web-App-Symbole, Android-Launcher-Symbole.

Schritt für Schritt: Ihr erstes SVG konvertieren#

Machen wir es gemeinsam.

Schritt 1: SVG ablegen#

Gehen Sie zu molixa.app/tools/svg-to-png.

Ziehen Sie Ihre SVG-Datei (oder mehrere) auf den Upload-Bereich.

Schritt 2: DPI wählen#

Am häufigsten: 2x Retina (192 DPI) für Webarbeiten. 300 DPI für Druck.

Schritt 3: Hintergrund auswählen#

Transparent behält die Transparenz des SVG bei. Verwenden Sie dies für Icons oder alles, was auf farbigen Hintergründen liegt.

Fester Hex-Farbcode füllt den Hintergrund. Nützlich für soziale Medien (die nicht immer gut mit Transparenz umgehen).

Schritt 4: Ausgabeformat wählen#

• PNG, Standard; verlustfrei, unterstützt Transparenz
• JPG, kleiner, keine Transparenz
• WebP, modern, am kleinsten, unterstützt Transparenz

Schritt 5: Konvertieren#

Für mehrere: Klicken Sie auf "Alle konvertieren". Für einzelne: nur ein Klick.

Schritt 6: Herunterladen#

Einzeldatei: direkter Download. Mehrere: ZIP-Datei mit allen Konvertierungen.

Dateinamen erhalten automatische Suffixe, [email protected] für Retina, [email protected] für Druck usw.

Realer Workflow: iOS App Icon Export#

So exportiere ich ein App-Icon in einem Durchgang.

Ich habe app-icon.svg (1024x1024 Quelle).

Ich ziehe es hinein. Führe Konvertierungen bei 1x, 2x, 3x gleichzeitig aus.

Ausgabe:

• app-icon.png (1024x1024), für den App Store
• [email protected] (2048x2048), für iPad
• [email protected] (3072x3072), für iPhone Pro Max

Drei Größen. Eine SVG-Quelle. 12 Sekunden.

Vergleiche mit manuellem Öffnen von Sketch / Figma, Exportieren jeder Größe, korrektem Benennen. Das dauert 15-20 Minuten.

Was ist mit CloudConvert und Adobe?#

Die großen Konkurrenten.

CloudConvert:

• Kostenlose Stufe: 25 Konvertierungen/Tag
• Bezahlpläne ab 9 $/Monat
• Cloudbasiert (Ihre Dateien werden hochgeladen)

Adobe Express:

• Kostenlose Stufe eingeschränkt
• Premium 9,99 $/Monat
• An Adobe Creative Cloud gebunden

Molixa SVG zu PNG:

• Unbegrenzte kostenlose Konvertierungen
• Nur Browser (kein Hochladen)
• Keine Anmeldung

Für Gelegenheitsnutzer sind die kostenlosen Optionen gleichwertig. Für intensive Arbeitsabläufe ist die reine Browserlösung der Cloud überlegen (keine Uploadzeit, keine täglichen Beschränkungen, keine Datenschutzbedenken).

Häufige SVG-Konvertierungsfehler#

Nachdem zu viele SVGs konvertiert wurden:

Fehler 1: Konvertierung mit Standard-DPI für Retina-Bildschirme. Das Ergebnis wirkt unscharf auf Macs und iPhones. Prüfen Sie immer, ob Ihr Ziel Retina ist.

Fehler 2: Transparenz nicht beibehalten, wenn nötig. Die Konvertierung mit weißem Hintergrund, wenn Sie transparent meinten, ist ein häufiger Fehler.

Fehler 3: PNG verwenden, obwohl WebP besser wäre. WebP ist bei gleicher Qualität 30% kleiner. Nutzen Sie es im Web.

Fehler 4: Vergessen, die tatsächliche Anzeigegröße zu testen. Konvertieren Sie, zoomen Sie dann in Ihr Design, um sicherzustellen, dass es noch gut aussieht.

Fehler 5: Externe Assets in das SVG einbetten. SVGs mit <image href="https://..."> beeinträchtigen die Leinwand während der Konvertierung und brechen den Export. Verwenden Sie base64 inline oder reine Pfade.

Profi-Tipps#

Schnelle Erfolge:

Tipp 1: Benennen Sie Ihre SVGs für Batch-Exporte einheitlich. Das Tool behält Namen mit Suffixen bei.

Tipp 2: Für Social-Media-Exporte verwenden Sie die Open-Graph-Voreinstellung (1200x630). Das ist das universelle Seitenverhältnis.

Tipp 3: Verwenden Sie für den Druck immer mindestens 300 DPI. Manche Druckereien verlangen 600 DPI für hochwertige Arbeiten.

Tipp 4: Generieren Sie Logos im 4-fachen Maßstab (384 DPI). So haben Sie Spielraum für zukünftige Anwendungen.

Tipp 5: Komprimieren Sie die resultierenden PNGs mit dem Molixa Bildkompressor, wenn Sie sie für das Web ausliefern.

SVG-Best Practices für sauberere Exporte#

Ein paar Hinweise:

Bereinigen Sie Ihre SVG-Quelle#

• Entfernen Sie ungenutzte Gruppen
• Ebenen zusammenführen
• Text in Pfade umwandeln (erhält die Darstellung)
• Metadaten entfernen

Sauberere SVGs konvertieren schneller und erzeugen kleinere PNG-Ausgaben.

Verwenden Sie eine korrekte viewBox#

Stellen Sie sicher, dass Ihr SVG ein korrektes viewBox-Attribut hat. Es bestimmt, wie das SVG während der Konvertierung skaliert wird.

Vermeiden Sie externe Abhängigkeiten#

Externe Schriftarten, eingebettete Skripte, verlinkte Bilder, diese können zu Konvertierungsfehlern führen. In sich geschlossene SVGs konvertieren zuverlässig.

Fazit#

Die Konvertierung von SVG zu PNG sollte nicht 10 Minuten pro Datei dauern.

Sie sollte 12 Sekunden für eine Stapelverarbeitung betragen.

Molixa SVG zu PNG Konverter verarbeitet einzelne Dateien, Stapel, Retina-Suffixe und moderne Formate. Kostenlos.

Lesezeichen setzen. Sparen Sie sich die 15 Minuten pro Design-Export.

Konzentrieren Sie sich wieder aufs Designen.