JSFiddle - React, Tailwind, and code Playground

by charlescarver

HTML

<input class="hex" value="" maxlength="6" size="6" />
<input class="alpha_a" value="" maxlength="1" size="1" />.
<input class="alpha_b" value="" maxlength="1" size="1"/>
<button>go</button>
<div></div>

CSS

div{
    height:30px;
    width:30px;
    border-bottom:1px solid rgba(0,0,0,1);
}

JavaScript

$("button").click(function() {
    var hex = $(".hex").val();
    var alphaa = $(".alpha_a").val();
    var alphab = $(".alpha_b").val();
    $("div").css({
        "background-color" : hex, "opacity" : alphaa + "." + alphab
    });
});