JSFiddle - React, Tailwind, and code Playground

HTML

<input type='checkbox' id='myCheck'><label for='myCheck'>Magic!</label>

CSS

#myCheck { visibility: hidden; }

input[type=checkbox] + label::before {
        display:inline-block;
        content:'[_]';
        position:relative;
        width:20px;
    }
    input[type=checkbox]:checked + label::before {
        content:'[x]';
    }