Ziggy Stardust

       
(CSS)

body, html {
  margin: 0;
  padding: 0;
  overflow: active;
}

#canvas {
  background-color: #000000;
}

(JAVA)

script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'
      script id="rendered-js"
function colorMe(h, s, l, a) {
  return 'hsla(' + h + ',' + s + ',' + l + ',' + a + ')';
}

var mouse = { x: 0, y: 0 };

function graph(w, h, dc, v) {

  document.addEventListener('mousemove', function (e) {
    mouse.x = e.clientX || e.pageX;
    mouse.y = e.clientY || e.pageY;
  }, false);

  dc.clearRect(0, 0, w, h);

  var angle_incr = (2 + v / 12.0) * Math.PI / 180,
  cx = w / 2,
  cy = h / 2,
  outer_rad = w / 2;

  for (var i = 1; i <= v; ++i) {
    var op = i > 0 ? v / i * 0.0675 : .0675,
    ratio = i / v,
    angle = i * angle_incr,
    fill = colorMe(i, '100%', '67%', op),
    spiral_rad = ratio * outer_rad,
    x = cx + Math.cos(angle) * spiral_rad,
    y = cy + Math.sin(angle) * spiral_rad;

    dc.fillStyle = fill;

    dc.beginPath();
    dc.moveTo(x, y);
    dc.lineTo(mouse.x, mouse.y);
    dc.lineWidth = i / 3;
    dc.strokeStyle = fill;
    dc.stroke();
  }
}

function myInit() {
  var w = window,
  e = document.documentElement,
  cnv = document.getElementById('canvas'),
  ctx = cnv.getContext('2d'),
  x = w.innerWidth,
  y = w.innerHeight,
  i = 2,
  ay = 0,
  gogo = false,
  ud = true;

  cnv.width = x;
  cnv.height = y;

  setInterval(function () {

    if (ud) {
      i = i < 360 ? i + 1 : i;
      ud = i > 359 ? false : true;
    }
    if (!ud) {
      i--;
      ud = i < 1 ? true : false;
    }
    graph(x, y, ctx, i);
  }, 10);
}

window.onload = function () {
  myInit();
};