Skip to content

Instantly share code, notes, and snippets.

@k1r8r0wn
Last active October 13, 2015 14:42
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save k1r8r0wn/e9fd318892202548dd4d to your computer and use it in GitHub Desktop.
Save k1r8r0wn/e9fd318892202548dd4d to your computer and use it in GitHub Desktop.
Background Gradient with animated Hue on JavaScript
function changeBackground() {
//change color every frame
//initialise colors ( hue, lightness)
var hue = 360;
var light = 0;
function changeHue() {
var col1 = Math.abs((hue % 720) - 360);
var col2 = Math.abs( ( (hue+90) % 720) - 360);
hue++ ;
//values for light adjustment not used
var light1 = Math.abs( (light % 40) - 20)+60;
var light2 = Math.abs( ( (light+10) % 40) - 20)+60;
light++ ;
document.body.style.background = 'linear-gradient(to right, hsl('+col1 +',70%, 75%) 0%,hsl('+col2 +',90%,75%) 100%)';
}
setInterval (changeHue, 64);
}
changeBackground();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment