JSFiddle - React, Tailwind, and code Playground
by hans101418011
HTML
<?php
$CH=$_GET["input_h"];
$CS=$_GET["input_s"];
$CL=$_GET["input_l"];
function LightW($RGB,$l){
$RGB=$RGB+(255-$RGB)*(($l-50)/50);
return $RGB;
}
function LightB($RGB,$l){
$RGB=$RGB-((50-$l)/50)*$RGB;
return $RGB;
}
function Saturation($RGB,$s,$l){
$RGB = $RGB-($RGB-(255*($l/100)))*(1-$s/100);
return $RGB;
}
/*function HSL2RGB($CH,$s,$l){
}*/
if($_GET["in"]=="1"){
if($CH<=60){
$CR=255;
$CG=255*($CH/60);
$CB=0;
if($CL>=50){
$CR=LightW($CR,$CL);
$CG=LightW($CG,$CL);
$CB=LightW($CB,$CL);
}elseif($CL<50){
$CR=LightB($CR,$CL);
$CG=LightB($CG,$CL);
$CB=LightB($CB,$CL);
}
$CR=Saturation($CR,$CS,$CL);
$CG=Saturation($CG,$CS,$CL);
$CB=Saturation($CB,$CS,$CL);
}elseif ($CH<=120) {
$CR=255*((120-$CH)/60);
$CG=255;
$CB=0;
if($CL>=50){
$CR=LightW($CR,$CL);
$CG=LightW($CG,$CL);
$CB=LightW($CB,$CL);
}elseif($CL<50){
$CR=LightB($CR,$CL);
$CG=LightB($CG,$CL);
$CB=LightB($CB,$CL);
}
$CR=Saturation($CR,$CS,$CL);
$CG=Saturation($CG,$CS,$CL);
$CB=Saturation($CB,$CS,$CL);
}elseif ($CH<=180) {
$CR=0;
$CG=255;
$CB=255*(($CH-120)/60);
if($CL>=50){
$CR=LightW($CR,$CL);
$CG=LightW($CG,$CL);
$CB=LightW($CB,$CL);
}elseif($CL<50){
$CR=LightB($CR,$CL);
$CG=LightB($CG,$CL);
$CB=LightB($CB,$CL);
}
$CR=Saturation($CR,$CS,$CL);
$CG=Saturation($CG,$CS,$CL);
$CB=Saturation($CB,$CS,$CL);
}elseif ($CH<=240) {
$CR=0;
$CG=255*((240-$CH)/60);
$CB=255;
if($CL>=50){
$CR=LightW($CR,$CL);
$CG=LightW($CG,$CL);
$CB=LightW($CB,$CL);
}elseif($CL<50){
$CR=LightB($CR,$CL);
$CG=LightB($CG,$CL);
$CB=LightB($CB,$CL);
}
$CR=Saturation($CR,$CS,$CL);
$CG=Saturation($CG,$CS,$CL);
$CB=Saturation($CB,$CS,$CL);
}elseif ($CH<=300)...
CSS
<style type="text/css">
#f1{
width: 220px;
margin: 0 auto 0 auto;
}
#f1 form{
text-align: right;
}
#f1 input{
padding: 5px;
margin: 5px;
margin-right: 30px;
width: 60px;
}
</style>