JSFiddle - React, Tailwind, and code Playground

by Abid Shaik

HTML

<!---->
<span>Current HighCharts </span><br>
<div style="background-color:#7cb5ec;"></div>

<div style="background-color:#434348;"></div>

<div style="background-color:#90ed7d; "></div>
<div style="background-color:#f7a35c;"></div>
<div style="background-color:#8085e9;;"></div>
<div style="background-color:#f15c80; ;"></div>
<div style="background-color:#e4d354;"></div>
<div style="background-color:#8085e8; "></div>
<div style="background-color:#8d4653;"></div>
<div style="background-color:#91e8e1;"></div><br>
<div>new Colors from Michael</div>
 <div style="background-color:#881B1C;"></div>
<div style="background-color:#886161;"></div>
<div style="background-color:#959341;"></div>
<div style="background-color:#083855;"></div>
<div style="background-color:#64AAD4;"></div>
<div style="background-color:#FAAC3F;"></div>
<div style="background-color:#882385;"></div>
<div style="background-color:#489529;"></div>
<div style="background-color:#115555;"></div>
<div style="background-color:#746CD4;"></div>
<div style="background-color:#447BD4;"></div>
<div style="background-color:#E16334;"></div>
<div style="background-color:#D76DEB;"></div>
<div style="background-color:#40EB83;"></div>
<div style="background-color:#E1C04E;"></div>
   


<div id="random" >
    <div>Random Colors</div><br>
</div>
<div id="colors"></div>

CSS

div {
width: 100px; 
height:100px;
float:left;
margin:4px;
}
#random{
    width:500px;
    height:500px;
}
#random div{
    float:left;

}

JavaScript

/*Random Color Pallet Demo */
$(document).ready(function(){
    var colors = []; 
    $("#colors").append("["); 
    for(var i=0; i<50;i++)
    {
     var c = '#'+(0x1000000+(Math.random())*0xffffff).toString(16).substr(1,6)
     colors.push(c); 
     $("#random").append("<div style='background-color:"+ c +";'>"+c+"</div>"); 
        $("#colors").append("'"+c + "'," + " ");
    }
    $("#colors").append("]"); 

});