Custon cursor color

by John kuoppala

HTML

<div id="test"></div>

CSS

html, body {width:100%;height:100%;margin:0;padding:0;}
#test {width:100%;height:100%;background:#fff}

JavaScript

function drawCursor(x,y,fill,stroke) {
    var cursor = document.createElement('canvas'),
    ctx = cursor.getContext('2d');
    cursor.width = 14;
    cursor.height = 19;
    ctx.lineWidth=1;
    ctx.moveTo(x,y);
    ctx.beginPath();
    ctx.lineTo(x+13,y+13);
    ctx.lineTo(x+7,y+13);
    ctx.lineTo(x+10,y+18);
    ctx.lineTo(x+7,y+19);
    ctx.lineTo(x+4,y+13);
    ctx.lineTo(x,y+17);
    ctx.lineTo(x,y);
    ctx.closePath();
    ctx.fillStyle=fill;
    ctx.fill();
    ctx.strokeStyle=stroke;
    ctx.stroke();

    document.body.style.cursor = 'url(' + cursor.toDataURL() + '), auto';
}

drawCursor(0,0,"white","black");