DRAW-SVG editor key features

Drawsvg is referenced by many websites

  • Extract from sitepoint.com :

    Maybe you have already found your free Web-based SVG editor among the apps so far but if you haven't, here is more. DrawSVG is a fully standards-compliant SVG editor with many features.
    What I really like about it is that it looks like a web application (i.e. menu on the left click to open submenu etc.) rather than the appearance of a desktop application brought to the web. With DrawSVG you can draw, modify, and render objects. This includes drawing basic shapes, Bezier curves, straight and curved text, numerous stroke and fill styles, etc. You can also export your SVG to PNG.

  • Read the review from fixthephoto.com

The drawsvg editor functionalities are organized into three categories of tasks and user profile (basic,expert) :

  • Tasks to manage documents (41 tasks including 17 expert, opening, saving, etc.)
  • Tasks to draw elements (35 tasks including 14 expert)
  • Tasks to modify the selected elements (65 tasks including 33 expert)

To explore features, see :

Below are main features ordered by usual themes

Draw objects

  • Basic elements (rectangle, circle, ellipse, line, polyline, polygon)
  • Bezier arcs (cubic, quadratic)
  • Shapes, Emoji and Font Awesome icons
  • Straight and curved text, single and multi-lines, with full feature editor
  • Images
  • Ready-made shapes (a lot of icons, arrows, flowcharts..)

Expert profile

  • Advanced elements (path, Bezier curves)
  • Path segments insert, remove and refactor
  • Drawing geometry with point capture to connect objects
  • Media controls (YouTube, video, audio, rich text)
  • Multi-language text
  • Document composition with svg included
  • Google Maps

Modify objects

  • Click an object, select the closest point clicked or all those inside in rectangle
  • Select easy with target and points highlighting
  • Moving the control points of the geometry of an object
  • Transform objects
  • Full interactive editing text with the mouse
  • Download and encode PNG into image objects

Expert profile

  • Edit geometry data
  • Insert intersections
  • Logical operations on closed shapes (union, intersection, difference)
  • Move and merge points
  • Apply constraints to objects
  • Animate elements
  • Manage layers, change the order of objects, align edges
  • Browse map location
  • Import svg files into included svg objects

Rendering objects

  • Copying the style of an object on another
  • WYSIWYG editing style properties
  • Color chooser (RGB, HSV, palette)
  • Stroke style (color, scaling, width, dash, opacity, gradient, pattern, cap, join)
  • Fill style (color, opacity, gradient. pattern, rule)
  • Text style (family, size, font-style,weight, anchor, decoration)
  • Marker style (start, mid, end)
  • Import custom shape catalog

Expert profile

Manage your drawing files

  • Save and load SVG files on your computer
  • Load images as SVG files
  • Optimize SVG file size.
  • Conversion into PNG images
  • Publish on Board tool

Expert profile

Interactive editing tools

Full svg made editing tools for a best rendered and interaction

Integration in a web application

  • Use DRAW-SVG as an integrated drawing tool within your web site
  • Edit and save your svg documents
  • Integration by API based on mozilla jsSchannel
  • Customize UI with your own application using HTML, CSS and javascript
  • See jsChannel demo ,  demo popup,  custom app,  and dev guide

 Run DRAW-SVG editor

Next showcases