 <p>In your color change handler, have all canvas change its (non-transparent) pixels to the new color.<br> For this, most simple is to use globalComposite operation mode 'source-in', and fill over the canvas with the new color : </p> <pre><code>// set all pixels of the image to this color function setCurrentColor(canvas, color) { var context = canvas.getContext('2d'); context.save(); context.fillStyle = color; context.globalCompositeOperation = 'source-in'; context.fillRect(0,0,canvas.width, canvas.height); context.restore(); } </code></pre> <p>i updated your demo : <a href="http://jsfiddle.net/gamealchemist/Z6g5Z/3/" rel="nofollow">http://jsfiddle.net/gamealchemist/Z6g5Z/3/</a></p>