Release your imagination and draw freely with DRAW SVG
DRAW SVG is a free online drawing editor with additional tools for generating, optimizing, converting your drawings and sharing them with a community.
- Designed for all content publishers, info graphic designers and developers.
- Edit your drawings with a powerful SVG editor.
- Browse, publish, share and comment drawings with an original graphic social network.
- Create memes with your favorite pictures and photos.
- Turn your photos into Impressionist drawings with Photo to drawing Tool.
- Discover the use of the editor with the interactive learning Showcases Tool.
- Generate your own shape catalog to insert in your drawings.
- Optimize the size of your SVG files before publishing them.
- Convert your SVG drawings to PNG images for publication.
- Encode your images (svg, png, jpeg) in base 64 for insertion into your HTML pages.
- Pure HTML5 and CSS styles
- Optimized for Chrome & FireFox, compatible with Edge, Safari and Opera.
- Touch device compatible.
- Integrate DRAW SVG editor in your website with developers integration API.
- Customize the UI with your own application.
Latest news
Version 8-3on July 2020
- Drawing geometry objects with point capture.
- Target point highlighter to easy point select.
- Point move task for large objects.
- Merging points task to connect geometries.
Version 8-2on June 2020
Version 8-1on May 2020
- New drawing repetitive mode
- New path polygon geometry panels
- Draw free smooth path
- Styling multiple objects together
- New dev tool scroll widget
Version 8-0on April 2020
Version 7-9on March 2020
See
release notes
Introduction to DRAW SVG Tools
DRAW SVG tools are online tools totally free and easy to use, full documented and professional qualities.
- Use the editor to create and edit your drawings.
- Optimize their size with the optimizer tool.
- Share and publish them with the board tool.
- Generate kinds of aquarelle with the photo to svg generator tool.
- Create easy simple memes with images.
- Discover how to use editor features with the elearning tool with use cases animations.
- Generate your personal shape catalog to import in the editor to customized it with your interest field.
- Use additional web designer tools as the png format svg converter and the image encoder to enrich the contents of your html pages.
Introduction to developer Tools
DRAW SVG developer tools are free software released under the GNU LGPL.
With these tools you can integrate drawsvg editor inside your web site.
- Request an API Key to activate your DRAW SVG integration.
- Then download Edrawsvg distribution.
DRAW SVG editor key features
Draw objects
- Basic elements (path, rectangle, circle, ellipse, line, polyline, polygon)
- Bezier curves (cubic, quadratic, arcs, smoothed)
- Shapes, Emoji and Font Awesome icons
- Straight and curved text
- Images and Google Maps
- Ready-made shapes (a lot of icons, arrows, flowcharts..)
- Media controls (YouTube, video, audio, rich text)
- Multi-language text
- Document composition with svg included
Modify objects
- Click an object, select the closest point clicked or all those included in a rectangle
- Select easy with target highlighting
- Manage layers, change the order of objects, align edges
- Moving the control points of the geometry of an object
- Transform objects
- Full interactive editing text with the mouse
- Browse map location
- Download and encode PNG into image objects
- Import svg files into included svg objects
Rendering objects
- Copying the style of an object on another
- WYSIWYG editing style properties
- CSS styles management
- 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)
- Customize gradients, filters, patterns and markers
Manage your drawing files
- Save and load SVG files on your computer
- Load images as SVG files
- Load documents from the openclipart gallery (currently off)
- Optimize SVG file size.
- Conversion into PNG images
- Publish on Board tool
Interactive editing tools
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,
custom app, and dev guide
DRAW SVG showcases tutorials
Learning the use of drawsvg is very fast and easy with the showcases tool.
- This is a learning tool that allows to play DRAW SVG feature discovery animations.
- This tool reproduces the recorded mouse and keyboard events of a DRAW SVG usage sequence on its interface.
- Use the search button to find a use case with a keyword then run it.
Drawing Board tool
An original graphic social network
Is a social network that manages signed topics composed of a drawing and a description classified by keyword and emojis.
Topics can be commented and followed by answers to build threads.
- Search latest topics by tags, keywords and emojis.
- Browse selection.
- Upload topics drawing.
- Sign In with a google account to add, comment or reply topics.
- To add a topic, select the topic's drawing creation mode from 4 different (from an image file, from a svg file, new meme, start new svg),
then set the description and its classification by tags and emojis.
- Reply to a topic by completing its drawing with the editor of DRAWSVG or by a new drawing.
- Edit your topics, drawings and descriptions.
Meme maker tool
Creating a meme is very easy
- Choose an image or a photo.
- Define the meme size.
- The meme can have up to three captions (top, center,bottom).
- Select a caption, enter its text.
- Adjust the text style.
- Background style and advanced properties (stroke color and filter).
- Then save the meme in SVG or PNG format.
- Finaly you can edit the drawing with the editor of DRAWSVG.
Contact
Partners
Stephen McLaughlin and Bart Butenaers, contributors to NODE-RED (the flow-based development tool for visual programming).
Dave GARDINER
- Provides professional editing, writing and illustration services.
- Has contributed to DRAW SVG especially to the development of
multi-language document functionality.
