SVG Editor

Edit SVG code with live preview. Draw shapes, pick colors, adjust strokes, and export your SVG files instantly.

SUBSCRIPTION TOOL
SVG Code Editor Live
0 chars
Shapes:
2
100%
1
Lines: 0 Size: 0 B Valid SVG Tool: Select
Live Preview Real-Time

Drop SVG File Here

or click to browse / paste SVG code in the editor

Drop SVG File
100%

How It Works

Choose a Shape Tool

Select rectangle, circle, line, text, or path from the toolbar.

Pick Colors

Set fill color, stroke color, and adjust opacity for each shape.

Edit SVG Code

Type or paste SVG code directly into the editor textarea.

Live Preview

Watch your SVG render in real-time as you type or draw shapes.

Export SVG

Copy SVG code or download the file when you are done editing.

Features

Live Preview

See changes in real-time as you edit SVG code

Shape Tools

Draw rectangles, circles, lines, text, and paths

Color Picker

Pick fill and stroke colors with visual color inputs

Stroke Width

Adjust stroke width from 0 to 20 pixels

Zoom Controls

Zoom in, out, fit to screen, or reset view

Undo / Redo

Undo and redo your edits with full history support

Export SVG

Download your SVG file or copy the code to clipboard

Import SVG

Upload or drag-and-drop SVG files to edit them

Watch How It Works