JSFiddle - React, Tailwind, and code Playground

HTML

<table>
<tr>
<td>10%</td>
<td>20%</td>
<td>30%</td>
<td>40%</td>
<td>50%</td>
<td>60%</td>
<td>70%</td>
<td>80%</td>
<td>90%</td>
<td>100%</td>
</tr></table>

CSS

div{
    width: 100px;
    height: 100px;
    background-color: red;
    position: absolute;
    left: 50px;
    top: 50px;
}

JavaScript

var rgb = [~~(Math.random()*255),~~(Math.random()*255),~~(Math.random()*255)];

    $(function(){
        $('td').each(function(i, elem){
           var $self     = $(elem),
               percent   = parseInt($self.text()),
               csscolor  = ['#'];

            rgb.forEach(function(value, index){
                this.temp = (~~((percent/100) * value)).toString(16);                
                csscolor.push(temp.length < 2 ? '0' + temp : temp);                
            });
            
            $self.css('background-color', csscolor.join(''));
        });
    });