JSFiddle - React, Tailwind, and code Playground

by Mike Rawling

JavaScript

function getColor(value){
    //value from 0 to 1
    var hue=((1-value)*50).toString(10);
    return ["hsl(",hue,",100%,50%)"].join("");
}

var len=20;

for(var i=0; i<=len; i++){
    var value=i/len;
    var d=document.createElement('div');
    d.textContent="value="+value;
    d.style.backgroundColor=getColor(value);
    document.body.appendChild(d);
}