Features of our HTML Canvas Editor
Freehand DrawingThe canvas is yours!
Draw anything in any color
and freely express yourself.
Build DiagramsUse predefined shapes like rectangles, circles,
or triangles to build charts and diagrams.
Use Lines and ArrowsMake use of lines and arrows to group and
connect various parts of your drawing.
Insert TextSay what you need to say and add
as much text to your drawing as you like.
Define size, font, color and border.
Create Custom ShapesIf you want to create your own shapes,
our polygon drawing tool has got you covered.
Edit or Erase AnythingNothing is forever, not even in your drawing.
Edit or erase anything, whenever you want.
Set Color, Opacity and BorderHave a great control of the
illustration of your shapes.
Image as BackgroundHave an image as your background.
You can even crop it while inserting.
Transparent BackgroundSet your background transparent to
draw on your website.
Float your DrawerMove the canvas on your website.
Or align it in your HTML.
Place your ToolbarsUse the toolbars connected to the canvas
(inside or outside) or place them wherever you want.
Configure Default PluginDefine any plugin to be automatically
selected when starting your drawing.
Insert ImageInsert any image and treat it as you want
to enrich your drawings. You can even crop it while inserting.
Need a specific function as a public method?
Format your TextUse multiline support, font weight,
text alignment, text background, and text decoration to prettify your text.
Works in All BrowsersWe've worked hard to provide
a great user experience
across all modern browers.
Ready for TouchDrawerJs is fully touch-enabled and works
great on tablets and smartphones as well.
Entirely CustomizableMake it yours and tailor colors, fonts,
and appearance to your needs, just as you like.
Zooming and MovingZoom into your canvas to
get a detailed view and move the canvas around.
Fullscreen ModeSet your canvas to fullscreen mode
or collapse it entirely.
ScreenshotWant to use a screenshot of your browser's window as an image or background?
Our upcoming feature will be incredible!
(Coming in Summer 2017)
Save the CanvasSave the drawn canvas in hidden areas of
your page or pass it to your own function.
Export an ImageAutomatically create an image from the
contents of the canvas when saving your drawing.
Standalone or Redactor pluginDrawerJs can be used as an independent
widget or as a plugin for Imperavi's Redactor.
Check out our documentation to learn how to get DrawerJs up and running and how to configure it.