)
}
}
)
(
}
{
)
)
(
)
(
(
{
}
)
(
)
}
)
)
{
(
(
)
)
}
)
(
}

Easy Random Color

  1.  
  2. document.body.innerHTML += 'click to randomize background color';
  3.  
  4. document.addEventListener('click', () => { 
  5.   const hue = Math.random() * 360;
  6.   document.body.style.background = `hsl(${hue}deg, 50%, 50%)`;
  7. });

One way to generate a random color is to randomize the hue argument of the css hsl. This value is in degrees 0-360 (colorwheel). The other arguments can be randomized as well if you need random saturation and lightness… like this:

  1.  
  2. document.body.innerHTML += 'click to randomize background color';
  3.  
  4. document.addEventListener('click', () => { 
  5.   const hue = Math.random() * 360;
  6.   const saturation = Math.random() * 100;
  7.   const lightness = Math.random() * 100;
  8.   document.body.style.background = `hsl(${hue}deg, ${saturation}%, ${lightness}%)`;
  9. });
// css // dom // graphics // javascript
snippet.zone ~ 2021-24 /// {s/z}