SVG EditorNEW
Edit SVG code on the left, watch it render live on the right
Checking your access…
AllFreeTool is a free online SVG editor that works right in your browser: write SVG code on the left and watch it render live on the right, so every keystroke updates the preview instantly. Upload a local SVG, tidy the formatting and shrink the file — everything happens on your machine and the code is never uploaded.
SVG is plain text, which means a drawing and a piece of code are the same thing. When a design tool hands you a messy export with tangled paths, stray comments and a bloated file size, this editor is where you clean it up. When you are tweaking an icon or debugging an animation, a live preview beats saving and reopening the file over and over.
Why use SVG Editor on AllFreeTool?
Split Screen
Roughly 70% of the width holds the code, the remaining 30% shows the live render.
Live Preview
The preview refreshes as you type, and a syntax error points at the exact line.
Upload a File
Load a local SVG straight into the editor, then copy the code or download the result.
Format
Clean indentation and aligned attributes, with 2 spaces, 4 spaces or tabs.
Optimise & Shrink
Drop comments and editor leftovers, compress numbers and shorten colours — the size change is shown live.
Runs Locally
Parsing and optimisation happen in the browser, so your code never reaches a server.
How to use SVG Editor
Load the Code
Paste SVG source, or press “Upload SVG” and pick a file from your computer.
Edit and Watch
Type on the left and the preview on the right updates live; syntax errors show the line number.
Tidy and Export
Run “Format” to tidy it up and “Optimize” to slim it down, then copy or download the SVG.
Common questions
How is this different from the SVG Maker?＋
The SVG Maker is a drawing tool: you drag shapes with the mouse and it writes the code for you. This editor is for code — editing an existing SVG, tweaking path data and cleaning up what a design tool exported. They work well together.
Why do scripts not run in the preview?＋
Before rendering, the preview strips script and foreignObject elements along with every on* event attribute, so no arbitrary code pasted into the editor can run on the page. The file you export is still the full source from your editor, nothing is removed from it.
Does “Optimize” change how the drawing looks?＋
Safe mode only performs equivalent compressions — number precision, shorter colour names, leaner path data — and the picture is unchanged. Aggressive mode additionally removes comments, metadata and design-tool leftovers, none of which affect rendering. Leave it off if you need to keep the author information.
My SVG file is too large — how do I shrink it?＋
Run “Optimize” first for an equivalent compression, then “Minify” to collapse it onto a single line and drop the XML declaration. That usually saves 30–50%. If it is still large, the file probably embeds a bitmap or carries far more path points than it needs.
Is my code uploaded to a server?＋
No. Parsing, formatting, optimisation and the preview all run in your browser, so the code never leaves your device.