JSFiddle - React, Tailwind, and code Playground

HTML

<div >
   
    <input id="mybox" type="checkbox">
         <label for="mybox" class="wrapperCheckbox">
</div>

CSS

input[type=checkbox] {
    display: none;
}
.wrapperCheckbox {
    width: 2em;
    height: 2em;
    background: red;
    display:block;
}
input[type=checkbox]:checked + label{
    
    background: blue;
    
}