Free online tools to generate, calculate,
convert, format, encode, and play.
 

SVG Studio

Complete SVG toolkit: a visual editor with shape and emoji presets on top, plus tools for optimizing, converting, inspecting, animating, filtering, viewBox math, and code formatting; your SVG flows between them automatically.


SVG Code

Drag & drop an .svg file here, or

Canvas

Insert:

Elements

Properties

Select an element to edit its properties.

Tools

Every tool works on the SVG in the editor above and updates live as you edit. Tool results can be loaded back into the editor.

Options

Result

Settings

Preview

Convert an SVG to see the preview.

Add an SVG in the editor above to inspect its element tree, attributes, and accessibility.

Path Data

Presets

Preview

Commands

#CmdParametersDescription

SVG Output

Add an SVG in the editor above to animate its elements.

Add an SVG in the editor above to apply filter effects.

Dimensions

Output

Content size follows the editor's viewBox; Apply to Editor resizes the editor canvas to match.

Preview

All Combinations

These act on the SVG in the editor above.


Embed This Util

You can embed this util on your own site as a widget. Adding ?embed=1 to the URL loads a compact version with just the tool itself; no header, menu, or documentation. Paste this snippet into your HTML:


    

Copy snippet Adjust the height to taste.


Feedback

Help us improve this page by providing feedback, and include your name/email if you want us to reach back. Thank you in advance.


Share with