Exploring canvas drawing techniques

Free Drawing in <canvas>

In html
<canvas id="c" width="500" height="300"></canvas>

In CSS

canvas{ border: 1px solid #ccc; }

In JS

var el = document.getElementById('c');
var ctx = el.getContext('2d');
var isDrawing;
el.onmousedown = function(e) {
  isDrawing = true;
  ctx.moveTo(e.clientX, e.clientY);
};
el.onmousemove = function(e) {
  if (isDrawing) {
    ctx.lineTo(e.clientX, e.clientY);
    ctx.stroke();
  }
};
el.onmouseup = function() {
  isDrawing = false;
};

BASIC

Editor link

http://codepen.io/kangax/pen/vGxEm

For all drawing techniques 

http://perfectionkills.com/exploring-canvas-drawing-techniques/