Optimieren Sie SVG online – SVGO-Voreinstellungen in Ihrem Browser

Optimieren Sie SVG gründlich mit SVGO sicheren, standardmäßigen oder aggressiven Voreinstellungen. Geht über die schnelle Minimierung hinaus – die gesamte Verarbeitung bleibt lokal.

Laden…
SVG-Optimierer – SVGO-Playbook
Optimieren Sie SVG gründlich mit SVGO-Voreinstellungen, die über die schnelle Regex-Minimierung hinausgehen. Wählen Sie zwischen sicherer, ausgewogener oder aggressiver Reduzierung – alles bleibt in Ihrem Browser.

Hinweise des Entwicklers

• SVGO wird nur bei Bedarf geladen (~780 KB), wenn Sie optimieren – nicht auf Minify-svg-Seiten. • Safe hält Pfade und IDs intakt; Aggressiv kann Pfade für eine kleinere Ausgabe zusammenführen. • Die Eingabe ist auf 512 KB begrenzt, damit die Registerkarte reaktionsfähig bleibt. • Zum schnellen Entfernen von Leerzeichen ohne SVGO verwenden Sie stattdessen minify-svg.

Optionen

SVGO voreingestellt
Wählen Sie „Sicher“ (minimales Risiko), „Standard“ (ausgewogen SVGO) oder „Aggressiv“ (maximale Größenreduzierung – kann die Grafik verändern). Standard beginnt bei Standard.

Wenn Teams diese Route wählen

• Figma- oder Illustrator-Exporte verkleinern, bevor Symbole versendet werden. • Vergleichen Sie sichere und aggressive Ergebnisse bei Marketingillustrationen. • Bereiten Sie Sprite-Kandidaten vor und behalten Sie dabei Titel/Beschreibung für die Zugänglichkeit bei. • Batch-Prüfung eines Assets nach dem anderen ohne CLI-Einrichtung.

Ausgearbeitete Beispiele

Marketing-Abzeichen mit Metadaten

Beispieleingabe

<svg xmlns="http://www.w3.org/2000/svg" width="240" height="72" viewBox="0 0 240 72" class="promo-badge" role="img" aria-labelledby="badge-title badge-desc"> <title id="badge-title">Schnelllieferungsabzeichen</title> <desc id="badge-desc">Abgerundetes Abzeichen mit Blitzsymbol und Hintergrund mit Farbverlauf.</desc> <defs> <linearGradient id="badgeGradient" x1="0%" y1="0%" x2="100%" y2="100%"> <stop offset="0%" stop-color="#f97316"/> <stop offset="100%" stop-color="#fb923c"/> </linearGradient> <clipPath id="badgeClip"> <rect x="0" y="0" width="240" height="72" rx="18" ry="18"/> </clipPath> </defs> <g clip-path="url(#badgeClip)"> <rect width="240" height="72" fill="url(#badgeGradient)"/> <g transform="translate(20 16)"> <circle cx="20" cy="20" r="20" fill="#0f172a" fill-opacity="0.14"/> <path fill="#fff" d="M24 4 11 22h9l-4 14 13-18h-9z"/> </g> <g font-family="Inter, Arial, sans-serif" fill="#fff"> <text x="76" y="31" font-size="18" font-weight="700">FastMinify</text> <text x="76" y="49" font-size="12" fill-opacity="0.92">Optimiertes SVG Asset</text> </g> </g> </svg>

Ausgabe

<svg xmlns="http://www.w3.org/2000/svg" width="240" height="72" viewBox="0 0 240 72" class="promo-badge" role="img" aria-labelledby="badge-title badge-desc"><title id="badge-title">Abzeichen für schnelle Lieferung</title><desc id="badge-desc">Abgerundetes Abzeichen mit Blitzsymbol und Farbverlauf Hintergrund.</desc><defs><linearGradient id="badgeGradient" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#f97316"/><stop offset="100%" stop-color="#fb923c"/></linearGradient><clipPath id="badgeClip"><rect x="0" y="0" width="240" height="72" rx="18" ry="18"/></clipPath></defs>⟦T14 ⟧<rect width="240" height="72" fill="url(#badgeGradient)"/><g transform="translate(20 16)"><circle cx="20" cy="20" r="20" fill="#0f172a" fill-opacity="0.14"/><path fill="#fff" d="M24 4 11 22h9l-4 14 13-18h-9z"/></g><g font-family="Inter, Arial, sans-serif" fill="#fff"><text x="76" y="31" font-size="18" font-weight="700">FastMinify</text><text x="76" y="49" font-size="12" fill-opacity="0.92">Optimiert SVG Vermögenswert</text></g></g></svg>

Standardmäßig voreingestellte Einsparungen

Beispieleingabe

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="icon"> <title>Stern</title> <path fill="currentColor" d="M12 2l3 7h7l-5.5 4 2 7L12 17l-6.5 3 2-7L2 9h7z"/> </svg>

Ausgabe

Kleineres SVG mit Kommentaren und Leerzeichen, die durch SVGO entfernt wurden.

Navigieren Sie durch verwandte SVG-Tools

Benötigen Sie eine schnellere Komprimierung nur für Leerzeichen? Verwenden Sie minify SVG. Konvertieren Sie in React mit SVG in JSX oder durchsuchen Sie den SVG Tools Hub.

SVG FAQ zum Optimierer

SVGO Voreinstellungen im Browser

Wann sollte minify-svg vs. Optimize-svg verwendet werden?

Verwenden Sie minify-svg für die sofortige Entfernung von Regex-Leerzeichen. Verwenden Sie Optimize-svg, wenn Sie eine SVGO-Pfadbereinigung und eine voreingestellte kontrollierte Tiefe benötigen.

Welche Voreinstellung soll ich wählen?

Sicher für Symbole mit IDs, Standard für die meisten Produktionsressourcen, aggressiv, wenn die Bytegröße wichtiger ist als die Pfadtreue.

Ist mein SVG hochgeladen?

Niemals – SVGO wird lokal ausgeführt, nachdem die Bibliothek geladen wurde.

Große Dateien?

Eingaben über 512 KB werden mit einer eindeutigen Meldung abgelehnt, um den Browserspeicher zu schützen.

SVG Werkzeuge

Vorschau anzeigen, mit SVGO optimieren, Daten exportieren URI, Größe ändern, verschönern, in JSX konvertieren und SVG validieren – alles in Ihrem Browser.

SVG validieren

Größe ändern SVG

SVG Betrachter

SVG zu Daten URI

SVG zu JSX

Weitere Werkzeugkategorien entdecken

Minimieren

Verkleinern Sie Code und Ressourcen für die Produktion – minimieren Sie JavaScript, CSS, HTML, JSON und XML vor der Bereitstellung von gzip oder CDN.

Verschönern

Machen Sie Code mit konsistenter Einrückung lesbar – verschönern Sie JavaScript, CSS, TypeScript, SCSS, LESS, Markdown, GraphQL, SQL, YAML und mehr in Ihrem Browser.

Aufheben

Erweitern Sie minimierten oder komprimierten Code – entminifizieren Sie JavaScript, CSS, TypeScript, SCSS, LESS, SQL, YAML und andere Formate beim Debuggen oder Überprüfen.

Konvertierung

Transformieren Sie Daten zwischen JSON, YAML, XML und CSV lokal – keine Server-Uploads.

CSS-Präprozessoren

Kompilieren Sie SCSS oder LESS zu Standard-CSS im Browser — kombinieren Sie mit Beautify oder Minify für einen vollständigen Stylesheet-Workflow.

JSON Werkzeuge

Validieren, formatieren, vergleichen und erkunden Sie JSON-Nutzlasten – ergänzend zu Minifiern und Konvertern.

DevOps und Infrastruktur

Terraform HCL formatieren/validieren/minimieren, Dockerfile formatieren und lint, Docker Verfassen und .env-Validierung.

CI/CD

GitHub Aktionen und GitLab CI – formatieren Sie YAML und überprüfen Sie die Workflow-/Auftragsstruktur in Ihrem Browser.

Protokolle und Beobachtbarkeit

Zeilenorientierte JSON/NDJSON- und Nginx/Apache-Zugriffsprotokolle – formatieren, filtern, validieren und CSV/TSV.

Kubernetes

Multi-Doc-Manifeste, strukturelle Validierung, Ingress/Deployment-Starter und Helm-Werteformatierung.

Netzwerk / IP

CIDR, Subnetze und IPv4/IPv6-Helfer — im Browser.

Sicherheit und Token

JWKS, X.509-Zertifikate und Secrets-Scan – browserlokal.

API & Schemata

OpenAPI Tools zum Formatieren, Validieren und Flusen Ihrer Spezifikationen.

Codierung

Kodieren oder dekodieren Sie Base64-, URL-Komponenten und HTML-Entitäten – nur clientseitig.

Entwickler-Dienstprogramme

Zeitstempel, UUID, ULID, Nanoid, Cron, Passwörter, Regex, Slugify, Zahlenbasen, Groß-/Kleinschreibung, Textunterschied und chmod – alles clientseitig.

Text & Markdown

Wörter zählen, Markdown-TOC erzeugen und Zeilenlisten bereinigen — im Browser.

KI & LLM

Token-Zählung, Kostenschätzung und Kontextfenster — 100 % im Browser.

Testdaten

Synthetische Feldwerte für Fixtures und DB-Seed — zuerst reservierte Telefonnummern.

Serialisierung

Serialisieren und deserialisieren Sie PHP-Datenstrukturen neben JSON-Workflows.