WebGL-2d HSL colors are brownish

index.html

<h3>Canvas 2d Default</h3>
<canvas id="canvas-default"></canvas>
<h3>Canvas Webgl-2d</h3>
<canvas id="canvas-webgl"></canvas>
<script src="webgl-2d.js"></script>
<script>
var width = 600,
    height = 200;

var canvasDefault = document.getElementById("canvas-default");
canvasDefault.width = width;
canvasDefault.height = height;

var canvasWebgl = document.getElementById("canvas-webgl");
canvasWebgl.width = width;
canvasWebgl.height = height;

WebGL2D.enable(canvasWebgl)
var ctx = canvasDefault.getContext("2d");
var webgl = canvasWebgl.getContext("webgl-2d");


var j = 10;
while (--j > 0) { 
  var i = 20;
  while (--i > 0) {
    var color = "hsl(" + (360/i) + "," + (100/j) + "%," + (60-j)+ "%)";
    ctx.fillStyle = color;
    webgl.fillStyle = color;
    ctx.fillRect(30*(i-1),20*(j-1),20,15);
    webgl.fillRect(30*(i-1),20*(j-1),20,15);
  }
}

</script>