JS gradient

Fork de http://jsfiddle.net/UYxs7/

HTML

<h3 class="fiddle-header"><a href="http://stackoverflow.com/questions/14542812/how-would-you-create-a-gradient-solely-with-javascript-no-css-that-goes-from-b/14542973#14542973">SO 14542812 : Pure JS Gradient</a></h3>

<canvas id="gradient"></canvas>

CSS

html, body {
    height:100%;
}
 
canvas#gradient {
    display:block;
    height: 100%;
    width: 100%;
}

JavaScript

var
  canvas = document.getElementById('gradient'),
  context = canvas.getContext('2d'),
  gradient = context.createLinearGradient(0, 0, 0, canvas.height);

gradient.addColorStop(0, '#0050ff');
gradient.addColorStop(1, '#770000');  

context.fillStyle = gradient;
context.fillRect(0, 0, canvas.width, canvas.height);