Häufige Fragen zum SVG Path Editor

svgpatheditor.de ist ein visueller Editor für SVG-Pfade. Du siehst deinen Pfad auf einer Zeichenfläche, ziehst die Punkte mit der Maus oder dem Finger und bearbeitest gleichzeitig das d-Attribut als Text. Alles läuft lokal in deinem Browser, ohne Upload und ohne Anmeldung.

Nein. Du kannst einfach ein Beispiel laden und die Punkte ziehen. Willst du es genauer verstehen, zeigt dir die Befehlsliste jeden einzelnen Befehl mit seinen Werten, und die Ratgeber erklären Schritt für Schritt, was M, L, C, Q, A und die anderen Befehle bedeuten.

Jeder Ankerpunkt auf dem Pfad ist ein runder Griff, jeder Bézier-Kontrollpunkt ein kleines Quadrat mit gestrichelter Führungslinie. Du fasst einen Griff an und ziehst ihn an die gewünschte Stelle. Das d-Attribut und die Befehlsliste aktualisieren sich dabei sofort.

Groß geschriebene Befehle wie M, L oder C nutzen absolute Koordinaten im Koordinatensystem. Klein geschriebene wie m, l oder c beziehen sich relativ auf den vorherigen Punkt. Über die Schalter „Absolut“ und „Relativ“ rechnet der Editor den ganzen Pfad in die eine oder andere Form um, ohne die Zeichnung zu verändern.

Ja. Du kopierst entweder nur das d-Attribut für dein eigenes <path>-Element oder lädst ein vollständiges SVG mit passender viewBox als Datei herunter. Über den Rundungs-Regler bestimmst du, mit wie vielen Nachkommastellen die Zahlen geschrieben werden.

Nein. Das Parsen, Zeichnen und Serialisieren des Pfades passiert komplett in deinem Browser. Es gibt keinen Server-Upload, du kannst das im Netzwerk-Tab der Entwicklertools überprüfen. Deine Grafiken verlassen dein Gerät nicht.

Ja. Der Editor parst Arc-Befehle (A und a) inklusive der beiden Flags korrekt, auch in der kompakten Schreibweise ohne Trennzeichen. Den Endpunkt eines Bogens ziehst du auf der Fläche, Radien und Rotation stellst du in der Befehlsliste ein.

Nein. svgpatheditor.de ist kostenlos und braucht keine Anmeldung. Du musst nichts installieren und keine E-Mail-Adresse angeben, sondern startest direkt. Über die Beispiel-Links bekommst du einen passenden Startpunkt.