JSFiddle - React, Tailwind, and code Playground

HTML

<div id="wrap">
<input type='checkbox' name='thing' value='valuable' id="thing"/><label for="thing"></label>
</div>
<br />
<input type='checkbox' id="standard"/><label for="standard"></label>

CSS

#wrap {
    width: 15px;
    height: 15px;
    border: 1px solid lightgrey;
}
#thing {
    display:none;
}
 
#thing + label
{
    background: #999;
    height: 9px;
    width: 9px;
    display:inline-block;
    padding: 0 0 0 0px;
    margin-left: 3px;
    margin-bottom: 3px
}
#thing:checked + label
{
    background: #0080FF;
    height: 9px;
    width: 9px;
    display:inline-block;
    padding: 0 0 0 0px;
}