Create A Drawing & Signature App With jQuery And HTML5 Canvas

File Size: 7.2 KB
Views Total: 15874
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Create A Drawing & Signature App With jQuery And HTML5 Canvas

Basic Canvas Paint is a jQuery plugin used to generate a touch-enabled drawing/paint/signature web app using HTML5 canvas and a little bit JavaScript.


  • Mobile-friendly.
  • Color picker.
  • Export as an image.

How to use it:

1. Import jQuery JavaScript library and the Basic Canvas Paint plugin's files into the document.

<link rel="stylesheet" href="css/bcPaint.css">
<link rel="stylesheet" href="css/">
<script src="" 
<script src="js/bcPaint.js"></script>

2. Create a container element in which you want to place the canvas.

<div id="bcPaint"></div>

3. Initialize the Basic Canvas Paint plugin. Done.




4. Customize the colors for the color picker.


    // default color
    defaultColor : '000000',

    // default color set
    colors : [
      '000000', '444444', '999999', 'DDDDDD', '6B0100', 'AD0200',
      '6B5E00', 'FFE000', '007A22', '00E53F', '000884', '000FFF'

    // extend default set
    addColors : []




This awesome jQuery plugin is developed by bobkovalex. For more Advanced Usages, please check the demo page or visit the official website.