SVG-viewBox-Editor
SVG-Code einfügen und viewBox, width und height in Echtzeit anpassen
Fügen Sie Ihren SVG-Code ein und passen Sie minX, minY, Breite und Höhe der viewBox sowie die Attribute width und height direkt über Zahlenfelder an – das Ergebnis sehen Sie sofort in der Live-Vorschau. Das Werkzeug richtet sich an Entwicklerinnen, Entwickler und Designer, die Icons zuschneiden, Ränder korrigieren oder Grafiken reparieren wollen, die wegen einer falschen viewBox abgeschnitten dargestellt werden. Sämtliches Parsen und Umwandeln geschieht ausschließlich in Ihrem Browser; nichts wird an einen Server übertragen.
도구를 불러오는 중…
🔒 Alles läuft zu 100 % in Ihrem Browser. Ihre Dateien und Eingaben werden niemals auf einen Server hochgeladen.
Anleitung
- Fügen Sie Ihr ursprüngliches SVG-Markup in das Eingabefeld für den SVG-Code ein.
- Die viewBox-Werte des eingefügten SVG erscheinen automatisch in den Feldern Min X, Min Y, Breite und Höhe.
- Ändern Sie die Zahlenwerte und verfolgen Sie das Ergebnis unmittelbar in der Vorschau rechts.
- Tragen Sie bei Bedarf die Attribute width und height ein und übernehmen Sie den fertigen SVG-Code über die Schaltfläche zum Kopieren.
FAQ
- Was passiert, wenn mein SVG gar keine viewBox hat?
- Fehlt das viewBox-Attribut, wird anhand der Attribute width und height eine passende Start-viewBox geschätzt und automatisch eingetragen.
- Wird mein SVG an einen Server gesendet?
- Nein. Die Verarbeitung erfolgt über DOMParser und XMLSerializer ausschließlich lokal im Browser, es werden keine Daten nach außen übertragen.
- Was geschieht bei fehlerhaftem SVG-Code?
- Schlägt das Parsen fehl oder lässt sich kein SVG-Element finden, erscheint im Vorschaubereich eine entsprechende Fehlermeldung.