SVG-Optimierer

SVG-Dateien optimieren, um die Dateigröße zu reduzieren

Dateien verlassen Ihr Gerät nicht
Läuft im Browser
Kostenlos, ohne Anmeldung, ohne Wasserzeichen

SVG-Dateien hier ablegen oder klicken zum Auswählen

Unterstützt SVG, SVGZ · Einfügen mit Strg+V / ⌘V geht auch

Oder SVG-Code einfügen

Tipp: SVG-Code lässt sich überall auf der Seite mit Strg+V / ⌘V einfügen.

So verwenden Sie: SVG-Optimierer

Verkleinern Sie SVG-Dateien mit SVGO, ohne den Browser zu verlassen. Wählen Sie die Voreinstellung Standard, Sicher oder Maximal oder schalten Sie einzelne Plugins, prüfen Sie einen Pixelvergleich mit dem Original und exportieren Sie als SVG, Data-URI oder React-Komponente.

Ziehen Sie SVG- oder SVGZ-Dateien auf die Seite oder fügen Sie SVG-Code ein; „Beispiel“ lädt ein Muster.

Wählen Sie unter „Optimierung“ „Standard“, „Sicher“ oder „Maximal“ und passen Sie „Zahlengenauigkeit“, „Mehrere Durchläufe“ und „Formatiert ausgeben“ an.

Optional: Öffnen Sie die Gruppen unter „Plugins“, um einzelne SVGO-Plugins ein- oder auszuschalten; „Zurücksetzen“ stellt den Standard wieder her.

Vergleichen Sie das Ergebnis „Nebeneinander“, mit dem „Schieberegler“ oder unter „Unterschiede“, wo geänderte Pixel rot erscheinen.

Wählen Sie den Reiter SVG, Data-URI oder React und klicken Sie auf „SVG herunterladen“ oder „.jsx herunterladen“; mehrere Dateien gibt es über „Alle herunterladen (ZIP)“.

Häufige Fragen

Werden meine SVGs hochgeladen?

Nein. SVGO läuft in einem Hintergrund-Worker in Ihrem Browser, die Dateien verlassen Ihr Gerät nicht.

Verändert die Optimierung das Aussehen meines SVGs?

„Standard“ zielt auf unverändertes Aussehen. „Unterschiede“ rendert beide Fassungen und zeigt den Anteil abweichender Pixel oder „Sieht identisch aus“. Eine sehr niedrige Zahlengenauigkeit kann feine Details verzerren.

Welche Voreinstellung passt zu animierten oder per Skript gesteuerten SVGs?

„Sicher“. Sie lässt Struktur, IDs und Formen unverändert, sodass CSS-Selektoren und Skripte ihre Elemente weiterhin finden.

Warum hat „Maximal“ width und height entfernt?

„Maximal“ entfernt zusätzlich Titel, Abmessungen und Skripte, ideal für Icons per CSS oder img; das SVG skaliert dann mit seinem Container. Um die Größe zu behalten, deaktivieren Sie removeDimensions unter „Einbettung im Web“.

Base64 oder URL-kodierte Data-URI?

Lassen Sie Base64 meist aus: Die URL-kodierte URI ist in der Regel kürzer und lässt sich besser mit gzip komprimieren. Schalten Sie es nur ein, wenn ein Werkzeug Base64 verlangt.

Wie funktioniert der React-Export?

Der Reiter React verpackt das optimierte SVG in eine JSX-Komponente, benannt nach der Datei, mit JSX-tauglichen Attributen und an das svg-Element durchgereichten Props. „.jsx herunterladen“ speichert sie.