$(document).ready(function () {

    $('body').prepend('<canvas id="gradientbg" height="600" width="600" style ="height:100%;left:0;position:absolute;top:0;width:100%;"></canvas>');
    $('#gradientbg').height($(document).height());
    var canvas = $('#gradientbg').get(0);

     ctx = null,
     grad = null,
     color = 255;
    if (canvas.getContext('2d')) {
        ctx = canvas.getContext('2d');
        ctx.clearRect(0, 0, 600, 600);
        ctx.save();
        //grad = ctx.createRadialGradient(0, 0, 0, 0, 0, 600);
        grad = ctx.createLinearGradient(0, 0, 0, 300);
        grad.addColorStop(0, '#CBEDF4');
        grad.addColorStop(1, ' #ffffff');
        ctx.fillStyle = grad;
        ctx.fillRect(0, 0, 600, 600);
        ctx.save();

    }

});

Linear Gradient with HTML 5 Canvas

html, html5

HTML