Color wheel

colorwheel.html

<canvas id=c width=256 height=256></canvas>
<script>
var TORAD = Math.PI/180,
	f = 360,
	d = f/256,
	canv = document.getElementById("c"),
  ctx = canv.getContext("2d"),
  cx = canv.width/2,
  cy = canv.height/2,
  t = 0,
  e = t+f,
  s = 0;

setInterval(function(){ 
  ctx.clearRect(0,0,canv.width,canv.height);
  for (t=0; t < e; t+=d) {
    let x1 = cx + Math.cos(t*TORAD)*cx;
    let y1 = cy + Math.sin(t*TORAD)*cy;
    let x2 = cx + Math.cos((t+d)*TORAD)*cx;
    let y2 = cy + Math.sin((t+d)*TORAD)*cy;
    let g = ctx.createLinearGradient(x1,y1, x2,y2);
    g.addColorStop(0, h2rgb(t+s));
    g.addColorStop(1, h2rgb(t+d+s));
    ctx.fillStyle = ctx.strokeStyle = g;
    ctx.beginPath();
    ctx.moveTo(cx, cy);
    ctx.lineTo(x1, y1);
    ctx.lineTo(x2, y2);
    ctx.closePath();
    ctx.fill();
    ctx.stroke();
  }
  s += 360/359;
}, 1/60);

function h2rgb(h) {
  let o="rgb(";
  h=(h+60)%360-120;
  for(let i=0;i<3;++i)o+=((h=(h+120)%360)<=120?255:(180<=h&&h<=300?0:(Math.abs(h-240)-60)*64/15))+",";
  return o.slice(0,-1)+")";
}
</script>