SVG-Optimierer
Verkleinern Sie SVG-Dateien mit SVGO: Metadaten und Ballast entfernen, Genauigkeit steuern, IDs und viewBox behalten und Vorher/Nachher vergleichen.
Lokal in Ihrem Browser verarbeitet. Ihre Datei wird nicht hochgeladen.
Was dieses Tool macht
SVG-Dateien aus Design-Tools enthalten oft Editor-Metadaten, Kommentare, Standardwerte und übergenaue Zahlen. Dieses Tool führt SVGO (den Standard-Optimierer für SVG) in Ihrem Browser aus und zeigt die Größe vorher und nachher sowie eine visuelle Vorschau beider Versionen, damit Sie prüfen können, dass sich nichts verändert hat.
Die Optionen decken die Entscheidungen ab, auf die es wirklich ankommt: die viewBox behalten, damit das Bild weiter skaliert, id- und class-Namen behalten, wenn Ihr CSS oder JavaScript darauf verweist, Metadaten, Kommentare oder Titel entfernen, festlegen, wie viele Dezimalstellen Pfade behalten, und Skripte entfernen. Ist eine Datei bereits minimal, sagt das Tool das, statt so zu tun, als würden Bytes eingespart.
Die Vorschau wird über ein Bildelement gerendert, sodass Skripte in einem SVG auf dieser Seite nie ausgeführt werden, und der Code wird als Text angezeigt. Enthält das SVG Skripte, Event-Handler, foreignObject oder externe Verweise, sehen Sie eine Warnung. Es wird nichts hochgeladen.
So verwenden Sie es
- 1Fügen Sie eine SVG-Datei hinzu.
- 2Lesen Sie gegebenenfalls die Warnungen zu Skripten oder externen Verweisen.
- 3Passen Sie die Optionen an. Das Ergebnis wird automatisch aktualisiert.
- 4Vergleichen Sie Größe und Vorschau vorher und nachher.
- 5Kopieren Sie den optimierten Code oder laden Sie die .min.svg-Datei herunter.
Unterstützte Formate
Eingabe und Ausgabe: SVG (.svg).
Datenschutz
Dieses Tool läuft in Ihrem Browser. Die von Ihnen eingegebenen Daten werden auf Ihrem Gerät verarbeitet und nicht an unsere Server gesendet.
Einschränkungen
- Geringere Genauigkeit verkleinert Dateien, kann aber feine Details sichtbar verzerren. Vergleichen Sie die Vorschau, bevor Sie das Ergebnis verwenden.
- Das Entfernen von IDs oder Klassen kann CSS, JavaScript oder <use>-Verweise beschädigen. Aktivieren Sie IDs und Klassen behalten, wenn Sie darauf angewiesen sind.
- Ohne viewBox skaliert das Bild nicht mehr mit seinem Container. Sie wird standardmäßig beibehalten.
- Bereits optimierte Dateien werden möglicherweise gar nicht kleiner und können in seltenen Fällen sogar geringfügig wachsen.
- Es werden nur SVG-Bilder unterstützt. In das SVG eingebettete Rasterbilder werden nicht neu komprimiert.
FAQ
Ist die Optimierung verlustfrei?
Mit den Standardeinstellungen sollte das Bild identisch aussehen. Das Verringern der Genauigkeit, das Zusammenführen von Pfaden oder das Entfernen von Titeln verändert den Dateiinhalt. Vergleichen Sie daher immer die Vorschau.
Warum wurde mein SVG nicht kleiner?
Es ist möglicherweise bereits minimiert. Versuchen Sie weniger Dezimalstellen oder entfernen Sie Titel und Metadaten, wenn Sie sie nicht brauchen.
Ist es sicher, SVG-Dateien mit Skripten zu öffnen?
Die Vorschau verwendet ein Bildelement, das keine Skripte ausführt, und der Code wird als Text angezeigt. Dennoch sollten Sie SVGs aus nicht vertrauenswürdigen Quellen nicht inline auf Ihren eigenen Seiten einbinden. Aktivieren Sie Skripte entfernen, um sie zu entfernen.
Was bewirkt IDs und Klassen behalten?
SVGO kürzt oder entfernt IDs, die es für ungenutzt hält, normalerweise. Wenn Sie sie behalten, bleiben Anknüpfungspunkte für CSS, Animationen und <use>-Verweise erhalten.
Ähnliche Tools
Favicon-Generator
Machen Sie aus einem Bild ein komplettes Favicon-Paket: favicon.ico, PNG-Größen, Apple Touch Icon, Android-Icons, Web-Manifest und HTML-Tags.
Farbpaletten-Generator
Erzeugen Sie Farbharmonien aus einer Grundfarbe, fixieren Sie Favoriten, prüfen Sie den WCAG-Kontrast und exportieren Sie nach CSS, Tailwind, JSON oder PNG.
Open-Graph-Bild-Generator
Gestalten Sie ein Social-Share-Bild mit 1200x630 Pixeln aus Titel, Logo und Hintergrund und laden Sie es als PNG herunter. Läuft komplett im Browser.
Farbpalette aus Bild
Extrahieren Sie die dominanten Farben eines Bilds, kopieren Sie Hex-Codes, wählen Sie mit der Pipette einzelne Pixel und exportieren Sie die Palette.