How to create online drawing app? With jQuery dRawr, for example!

jQuery dRawr is online drawing jquery plugin to turn any canvas element into a drawing area with a lot of useful tools and brushes.

Build your online Photoshop with jQuery dRawr 🙂

The dRawr library makes use of JavaScript (jQuery) and Canvas to create a customizable, mobile-friendly drawing app. There is a Photoshop-like toolbar, containing useful tools.

Main features (tools): Airbrush, Brush, Eraser, Eyedropper, Filled Square, Marker, Move, Pencil, Square, Text, Custom tool & brush, Color picker, Image zoom, Image export/import and more.


jQuery dRawr plugin
jQuery dRawr plugin

What do to with created image?

Process, share and/or save. For this check out the topic of HTML5 canvas data. Load and edit? Sure, use your imagination.




<div style="width:400px; height:300px;" class="my-container">
  <canvas id="canvas"></canvas>

$("#canvas").drawr({ "enable_tranparency" : true, "canvas_width" : 800, "canvas_height" : 800 });

License: MIT

Homepage and docs



See also

iPicture – tooltip your photos

MagnigierRentgen – a jQuery plugin for magnifying images (x-ray)

TagCanvas – HTML5 canvas tag cloud