SVG Online Editors

As I was updating the SVG Tutorial, I came across two web-based SVG editors: SVG-edit and Method Draw. Both only use JavaScript, HTML5, CSS and SVG. They both seem like decent shape editors but neither supports scripting.

SVG-edit

SVG-edit is a feature-rich editor now on version 2.5.1. It was initially released in 2009. It pretty much has everything and the kitchen sink. The import functionality worked with the image that I tried but it was not perfect.

Once you are done, you can save the source or export to a png file. SVG-edit's user interface is best described as a bit of a mess. There are good tooltips if you hover but there's some icons that are unclear and other parts are oddly labeled. Copy does not normally mean duplicate for example.

Links:

• Google Code Project
• Try SVG-edit v2.5.1

Method Draw

Method Draw is fork of SVG-edit that claims to offer a better user experience. It did indeed feel a bit slicker and less awkward. It drops the "ribbon" interface for a far easier to understand traditional menu interface. Some of its features like the shape library will also be added to v2.6 of SVG-edit.

Links:

• Github Project
• Try Method Draw