Uniquely generated colours

HTML

<div id="elements">
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
  <div></div>
</div>

CSS

div {
  display: inline-block;
  min-height: 100px;
  min-width: 40px;
}

JavaScript

const elements = document.querySelectorAll('#elements > div')

for (let i = 0; i < elements.length; i++) {	
	const element = elements[i];
  const saturation = "85%";
  const lightness = "70%"
  
  // The magic piece of code
  const hue = i * 137;
  const hueMod360 = hue % 360;
  
  element.style.backgroundColor = `hsl(${hueMod360}, ${saturation}, ${lightness})`
  element.innerText = `Value: ${hue}\nHue: ${hueMod360}`
}