Canvas двумерная сетка, html5

Подскажите пожалуйста, как нарисовать на canvase двумерную сетку в квадратик ? Вот к примеру есть у меня облако синее, как переделать на сетку?

    function draw(scale, translatePos){
            var canvas = document.getElementById("myCanvas");
            var context = canvas.getContext("2d");
            // clear canvas
            context.clearRect(0, 0, canvas.width, canvas.height);
            context.save();
            context.translate(translatePos.x, translatePos.y);
            context.scale(scale, scale);
            context.beginPath(); // begin custom shape
            context.moveTo(0, 0);
            context.bezierCurveTo(-159, 0, -159, 50, -59, 50);
            context.bezierCurveTo(-39, 80, 31, 80, 51, 50);
            context.bezierCurveTo(131, 50, 131, 20, 101, 0);
            context.bezierCurveTo(141, -60, 81, -70, 51, -50);
            context.bezierCurveTo(31, -95, -39, -80, -39, -50);
            context.bezierCurveTo(-89, -95, -139, -80, -119, -20);
            context.closePath(); // complete custom shape
            var grd = context.createLinearGradient(-59, -100, 81, 100);
            grd.addColorStop(0, "#8ED6FF"); // light blue
            grd.addColorStop(1, "#004CB3"); // dark blue
            context.fillStyle = grd;
            context.fill();
            context.lineWidth = 5;
            context.strokeStyle = "#0000ff";
            context.stroke();
            context.restore();
        }