Loading page
About this tool
Parses an SVG path d attribute into editable commands, converts between relative and absolute form, moves and scales it, and previews the result live.
An SVG path editor breaks a path's d attribute into its individual commands so you can read and change them one number at a time. This one follows SVG 1.1 §8.3 exactly — all ten commands (M, L, H, V, C, S, Q, T, A, Z), implicit command repetition, and the single-character arc flags that trip up most parsers — and it measures the true bounding box by solving each Bézier's derivative for its extrema rather than guessing from the control points. It is for icon designers cleaning up an export, developers hand-tuning an inline SVG, and anyone who needs to know how big a path really is.
Open SVG Path Editor on AltFTool — it loads instantly in your browser.
Upload or drag in the file you want to work with.
Adjust the settings and preview the result.
Download the finished file to your device.
Cubic and quadratic extrema are solved algebraically and arcs are converted to Béziers first, so the box is tight around the curve.
The large-arc and sweep flags are read as single characters, so compact paths like "a1 1 0 011 1" parse the way a browser parses them.
Every parameter of every command is an input box, and the preview and bounding box update as you type.
Uppercase means absolute coordinates measured from the origin of the user coordinate system; lowercase means relative to the current point. So after M 10 10, the command L 20 20 draws to (20, 20) but l 20 20 draws to (30, 30). Relative form usually compresses better because the numbers are smaller.
rx, ry, x-axis-rotation, large-arc-flag, sweep-flag, x, y. The first two are the ellipse radii, the third rotates the ellipse in degrees, the two flags each hold only 0 or 1 and pick which of the four possible arcs to draw, and the last two are the endpoint. If the radii are too small to reach the endpoint, SVG 1.1 Appendix F.6.6 says they are scaled up until they fit.
Because a Bézier curve does not reach its control points. For M 0 0 C 0 100 100 100 100 0 the control points sit at y = 100, but the curve's highest point is y = 75, found by solving the derivative of the cubic for t in (0, 1). Tools that report the control-point hull will tell you 100, which is why a viewBox based on that leaves visible padding.
Yes. Converting to relative form, rounding coordinates and dropping unnecessary separators are all lossless in the sense that the rendered shape stays the same to within the rounding you choose. At 3 decimals any point moves by at most 0.0005 user units. What is not safe is rounding a path drawn on a small viewBox to 0 decimals, which can visibly flatten curves.