SVG-Optimierer
Optimieren Sie Ihre SVG-Dateien mit KI-gestützter TechnologieBis zu 90 % kleinere Dateien bei gleichbleibender Qualität
SVG-Datei hierher ziehen
oder zum Hochladen auswählen
Nur SVG-Dateien bis 10 MB
Kostenlos nutzbar
Unbegrenzte Nutzung
Keine Kreditkarte nötig
Sofort starten
Ohne Registrierung
Direkt loslegen
Warum ToSVG?
Beste Ergebnisse dank KI-gestützter Technologie
Schnelle Optimierung
Optimieren Sie Ihre SVG-Dateien in Sekunden mit unseren KI-gestützten Algorithmen. Leistung auf Enterprise-Niveau.
Kleinere Dateien
Unnötige Metadaten und überflüssiger Code werden entfernt – für bis zu 90 % kleinere Dateien. Professionelle Ergebnisse garantiert.
Qualität bleibt erhalten
Optimierte SVG-Dateien ohne Einbußen bei der visuellen Qualität. Qualitätskontrolle auf Enterprise-Niveau.
KI-gestützte Technologie
Wir optimieren Ihre SVG-Dateien intelligent mit modernsten KI-Technologien. Unser System lernt aus Tausenden von Optimierungen und garantiert stets die besten Ergebnisse.
99,9 % Erfolgsquote
10.000+ Optimierungen
Unbegrenzte Nutzung
So funktioniert die SVG-Optimierung
Ihre Datei wird mit SVGO verarbeitet, dem weit verbreiteten Open-Source-SVG-Optimierer, und zwar mit dem Standard-Preset im Multipass-Modus: Die Durchläufe wiederholen sich, bis die Datei nicht mehr kleiner wird. Das ändert sich dabei.
Editor- und Dokument-Ballast wird entfernt
XML-Deklaration, DOCTYPE, Kommentare und <metadata>-Blöcke werden entfernt, ebenso zusätzliche Namespaces und Attribute, die Editoren wie Inkscape, Illustrator und Sketch in die Datei schreiben. Auch allgemeine „Created with …“-Beschreibungen fallen weg. Auf die Darstellung des Bilds hat das keinen Einfluss.
Zahlen werden gerundet, Pfaddaten neu geschrieben
Koordinaten und andere Zahlenwerte werden auf drei Nachkommastellen gerundet. Pfadbefehle werden in ihre kürzeste gleichwertige Form umgeschrieben, überflüssige Segmente entfallen, und benachbarte Pfade mit identischem Stil können zu einem zusammengeführt werden.
Formen, Gruppen und Transformationen werden vereinfacht
Rechtecke, Linien und Polygone werden in Pfade umgewandelt, wenn das kürzer ist. Leere Gruppen und Container werden entfernt, überflüssige Hüllgruppen aufgelöst und Transformationen zusammengefasst oder, wo möglich, direkt angewendet.
Stile und Farben werden bereinigt
Farben werden in der kürzesten Schreibweise angegeben (zum Beispiel wird #ff0000 zu red), CSS in <style> wird minimiert, Attribute, die nur SVG-Standardwerte wiederholen, werden entfernt, und versteckte oder leere Elemente werden gelöscht.
Ungenutzte IDs und Definitionen werden entfernt
IDs, auf die in der Datei nichts verweist, werden gelöscht, und ungenutzte Verläufe, Muster und andere <defs> entfallen. IDs, die noch referenziert werden, behalten ihren Namen; sie werden nicht gekürzt.
Die viewBox bleibt, feste Maße nicht
Die viewBox bleibt immer erhalten, damit die Grafik korrekt skaliert. Die Attribute width und height werden entfernt, sodass das SVG jeden Rahmen ausfüllt, in den Sie es setzen. Das Ergebnis steht in einer einzigen Zeile mit einheitlicher Attributreihenfolge, was auch gzip hilft.
Was sich gefahrlos optimieren lässt und wann Vorsicht geboten ist
Statische Icons, Logos und Illustrationen aus Design-Tools, auch SVGs aus unseren Konvertern, lassen sich gefahrlos optimieren und profitieren meist am meisten. In diesen Fällen sollten Sie das Ergebnis genauer prüfen.
IDs, die externes CSS, JavaScript oder Sprites nutzen
Der Optimierer sieht nur die Datei selbst. Wenn ein externes Stylesheet, ein Skript oder ein <use href="icons.svg#name"> auf einer anderen Seite eine ID anspricht, wirkt diese ID ungenutzt und wird entfernt. Dateien mit eigenem <style>- oder <script>-Element behalten ihre IDs.
Animierte SVGs
SMIL- oder CSS-Animationen, die Pfaddaten morphen oder auf eine bestimmte Gruppenstruktur angewiesen sind, können beim Umschreiben der Pfade und Auflösen der Gruppen kaputtgehen. Einfache Animationen überstehen das meist, prüfen Sie das Ergebnis aber immer in der Vorschau, bevor Sie das Original ersetzen.
Text für Barrierefreiheit
Das <title>-Element wird entfernt. Braucht ein Screenreader eine Beschriftung, ergänzen Sie Alt-Text am <img>-Tag oder ein aria-label dort, wo Sie das SVG einbetten.
Ebenen, die per Code ein- und ausgeblendet werden
Elemente, die mit display="none" oder Deckkraft null ausgeblendet sind, gelten als unsichtbar und werden entfernt. Wenn Ihr Skript sie später einblendet, optimieren Sie eine Kopie, in der diese Ebenen nicht ausgeblendet sind.
Dateien, die Sie noch bearbeiten möchten
Inkscape-Ebenen, Hilfslinien und andere Editor-Daten sind nach der Optimierung weg. Behalten Sie Ihre Quelldatei zum Bearbeiten und veröffentlichen Sie die optimierte Kopie.
FAQ zum SVG-Optimierer
Verändert die Optimierung das Aussehen meines SVG?
Bei fast allen Dateien nicht. Entfernt werden Daten, die nicht dargestellt werden, der Rest wird in kürzerer Form neu geschrieben. Sichtbar werden kann höchstens die Rundung auf drei Nachkommastellen, etwa bei Grafiken mit sehr kleiner viewBox, die in großer Darstellung angezeigt werden.
Wie viel kleiner wird meine SVG-Datei?
Das hängt davon ab, woher die Datei stammt. Exporte aus Design-Tools mit Metadaten, Kommentaren und langen Dezimalzahlen schrumpfen oft deutlich, bereits minimierte Dateien dagegen kaum. Die Ergebnisseite zeigt die genaue Größe vorher und nachher.
Wie groß darf die Datei maximal sein?
Sie können SVG-Dateien bis 10 MB hochladen. Statt eine Datei hochzuladen, können Sie den SVG-Code auch direkt im Tab „Code einfügen“ einfügen.
Warum wurden width und height entfernt?
Der Optimierer behält die viewBox und entfernt feste Werte für width und height, damit sich das SVG an seinen Container anpasst. Brauchen Sie eine feste Größe, setzen Sie width und height am <img>-Tag oder in CSS.
Kann ich SVGs optimieren, die in einem Sprite oder per JavaScript verwendet werden?
Seien Sie vorsichtig. IDs, auf die nur von außerhalb der Datei verwiesen wird, werden entfernt, weil der Optimierer diese Verweise nicht sieht. Testen Sie die optimierte Datei am Einsatzort oder behalten Sie in solchen Fällen das Original.
Entfernt der Optimierer Informationen zur Barrierefreiheit?
Er entfernt das <title>-Element und allgemeine Editor-Beschreibungen. Geben Sie den zugänglichen Namen dort an, wo das SVG eingebettet ist, zum Beispiel per Alt-Text oder aria-label.