Aufräumen eines aus Figma, Illustrator oder Sketch exportierten SVG-Icons, bevor es ins Repo geht. SVG-Payload trimmen, bevor es inline in HTML oder CSS landet (wo jedes Byte mit jeder Seite ausgeliefert wird). XML-Kommentare entfernen, die Design-Tools einbauen ("Generator: Adobe Illustrator…"). Schneller Sanity-Check, bevor das SVG als data:-URL kodiert wird.

SVG-Optimierer

SVG-Dateien im Browser minifizieren. Entfernt Kommentare, überflüssige Leerzeichen, Standard-Attribute und rundet lange Dezimalzahlen. Datei verlässt dein Gerät nie.

SVG input

🔒 Files never leave your browser — no upload, no server, no tracking.

Optionen

Remove comments Collapse whitespace Drop default attrs Round coords (2 dp)

Optimized SVG

Geben Sie oben eine Eingabe ein, um das Ergebnis zu sehen.

Wofür ist das?

Dieses Tool führt eine kleine Reihe handgeschriebener Regex-Durchläufe über ein SVG aus, um die Bytegröße zu verringern: XML-Kommentare entfernen, Whitespace zwischen Tags zusammenfassen, ein paar Attribute löschen, die ohnehin Default-Werte tragen, und lange Dezimal-Koordinaten auf 2 Stellen runden. Jeder Durchlauf ist als Checkbox abschaltbar. Alles passiert im Browser — kein Upload, kein Server.

Wann verwenden

Aufräumen eines aus Figma, Illustrator oder Sketch exportierten SVG-Icons, bevor es ins Repo geht.
SVG-Payload trimmen, bevor es inline in HTML oder CSS landet (wo jedes Byte mit jeder Seite ausgeliefert wird).
XML-Kommentare entfernen, die Design-Tools einbauen ("Generator: Adobe Illustrator…").
Schneller Sanity-Check, bevor das SVG als data:-URL kodiert wird.

Häufige Stolpersteine

Nicht so aggressiv wie SVGO. Die echte SVGO-Bibliothek kann Pfad-Optimierung, viewBox-Cleanup und Dutzende anderer Passes. Dieses Tool macht bewusst nur die sicheren, offensichtlichen Schritte — um null Abhängigkeiten und 100 % Browser-only zu bleiben.
Default-Attr-Entfernen ist konservativ. Es entfernt nur eine kurze Liste bekannter Defaults (stroke="none", fill-rule="nonzero", etc.). Wenn dein SVG diese explizit braucht (z. B. für CSS-Styling), schalte die Option ab.
Koordinaten-Rundung ist verlustbehaftet. 2 Dezimalstellen sind für Icons und Logos sicher; für Diagramme mit hoher Präzision lieber abschalten.
Whitespace-Zusammenfassen kann <text> brechen. SVG-<text>-Elemente mit mehrfachen Leerzeichen verlieren sie. Bei Icon-SVGs (kein Text) ist das nie ein Problem.