SVG & Vector
SVG Editor
A basic online SVG editor for quick edits. Upload or paste an SVG, recolor its shapes, change its text, and toggle layer visibility, then copy or download the result. This is not a full Inkscape replacement, just a fast way to make small changes.
// Edited SVG markup will appear here
How it works
Your SVG is parsed in the browser with the native DOMParser. The editor then lists three kinds of editable items: shape elements (path, rect, circle, ellipse, polygon, line, and polyline) whose fill and optional stroke you can change;text elements whose content you can rewrite; and top-level layers you can show or hide. Every change mutates the parsed document directly.
After each edit the document is re-serialized with XMLSerializer, which updates both the live preview and the code box. Because all of this runs locally, nothing is uploaded, and invalid markup is caught and reported instead of breaking the page.
Frequently asked questions
Is this a full SVG editor like Inkscape?
No. This is a basic editor for quick tweaks: recoloring shapes, editing text, and toggling layer visibility. For drawing new paths, transforms, and advanced vector work, use a dedicated tool like Inkscape or Figma.
Does my SVG get uploaded anywhere?
No. Everything happens locally in your browser. The file is read, parsed, and edited client-side, so nothing is sent to a server.
Why can I not edit some colors?
The color picker edits the fill attribute on each shape. If an SVG sets colors through CSS classes, gradients, or inline style blocks, those will not appear as editable shape fills here.
What does hiding a layer do?
Hiding a top-level element adds display: none to its style, which removes it from the rendered output. Showing it again removes that declaration. The element stays in the markup either way.