JSFiddle - React, Tailwind, and code Playground

by Mark Friesen

HTML

<div class="box">

</div>

CSS

.box { width: 320px; height: 320px;  }

JavaScript

function shadeColor2(color, num) {   
       var percent = 1-num;
			    var f=parseInt(color.slice(1),16),t=percent<0?0:255,p=percent<0?percent*-1:percent,R=f>>16,G=f>>8&0x00FF,B=f&0x0000FF;
			    return "#"+(0x1000000+(Math.round((t-R)*p)+R)*0x10000+(Math.round((t-G)*p)+G)*0x100+(Math.round((t-B)*p)+B)).toString(16).slice(1);
			}
			
var color = shadeColor2("#BB3a33",0.8);

$(".box").css("background-color",color);