SVG Editor

svg editor

A super simple yet powerful, user-friendly, browser-based, HTML5 SVG vector editor.
Built with React.js and Fabric.js.
Go to editor

Use it in your website or app!

Provide your users an easy-to-use drawing tool. Or alternatively, it's also a great starting point to build more complex things, like Canva. The editor is built with the latest web development tech. It’s available to buy on CodeCanyon marketplace.
Buy it now!

Editor features

The aim was to keep the editing experience easy for the average user. It contains only the minimum, most basic tools that are necessary to draw almost anything.

  • Object settings: color & gradient fill, border, alignment, transformations, image effects
  • Basic shapes included
  • Connectable lines and curves, free draw
  • 15° jumps on rotation and line drawing (while holding Shift)
  • Textbox with font settings
  • File upload via HTML5 File API, so we don’t need a server
  • Save image as SVG, JPG or PNG
  • Basic shortcuts: arrow key, undo/redo, copy/paste
  • You can also paste an image from the clipboard
  • Zoom (Ctrl +/-, Ctrl + mouse wheel)
  • Cross-browser support, displays a warning for old browsers
  • Touch friendly (tested on touchscreen notebook)
Buy it now!
svg editor features

Code features

svg editor code features
  • Built with the latest React features
  • Re-usable JS components
  • Easy to translate: all texts are stored in a JSON file
  • Clean, commented code
  • Works in all modern, major browsers
  • Easy to maintain and modify
  • Documentation
Buy it now!