Canvas Pseudo-Shader

index.html

<canvas id="painting" width=960 height=500></canvas>
<script>
// set up the canvas
canvas = document.getElementById("painting")
screen = canvas.getContext("2d")

// colored gradient
i = 255
while (i--) {
  j = 255
  while (j--) {
    red = i
    green = 255 - j
    blue = 80

    screen.fillStyle = "rgb(" + red + "," + green + "," + blue + ")"
    screen.fillRect(i,j,1,1)
  }
}
</script>

thumbnail.png