SVG Path Editor
Use SVG Path Editor, review the result, and keep the original until the output is checked.
Path Data
Commands
Shape Library
Export Options
How to use SVG Path Editor
- Type or paste path data into Current Path Data, or press a command button to append one - Move To (M), Line To (L), Horizontal Line (H), Vertical Line (V), Cubic Bezier (C), Smooth Cubic (S), Quadratic Bezier (Q), Smooth Quadratic (T), Elliptical Arc (A), Close Path (Z).
- Press Update Path to redraw, and adjust Fill Color, Stroke Color and Stroke Width as you go.
- Drag the control points on the canvas to move the geometry; use Play, Pause and Reset with Animation Speed (1-10) to watch the path draw itself.
- Copy Path for the d attribute alone, or Export SVG, PNG, Base64 or CSS. A heart, star, arrow and other samples are there to take apart.
What SVG Path Editor actually does to your file
Drawing happens in a fixed 200 by 200 unit space, so coordinates are absolute and values outside that box are simply off-canvas. The draggable control points exist for the M, L, C and Z commands; H, V, S, Q, T and A still render correctly but the editor cannot show handles for them, and relative lowercase commands are parsed loosely - paste them but drag with care. Export PNG rasterises at the SVG's own size, so the bitmap is 200 px square unless you change it.
SVG Path Editor FAQ
What does SVG Path Editor do?
Edit, manipulate, and visualize SVG paths effortlessly with our free online tool. Perfect your vector graphics by modifying path commands in real-time!
Which files work with SVG Path Editor?
This category commonly supports SVG and exported PNG. Use the accepted file types shown in the uploader, because support varies by browser and by the engine behind each tool.
What can I change with this tool?
The controls on this page define the scope. Anything the format supports but the tool does not expose will be left as it came in.
Will my original file be changed?
No. The work is done on a copy in this tab by the browser's own SVG document model, and the result arrives as a separate download, so your original is still there if you need it.
How is my file processed?
It is not uploaded. The processing is done locally by the browser's own SVG document model, so the practical ceiling is your device's memory and the limit shown beside the uploader - no queue, no account, no copy on a server.
Is the SVG Path Editor free?
Yes. The SVG Path Editor is free with no trial limit, subscription, or watermark on downloads. You can use it for personal and commercial projects without creating an account.