JSFiddle - React, Tailwind, and code Playground

by p4bl1t0

HTML

<div>
    <label for="check" class="cbx-fancy-prelabel">Esto es para checkear</label>
    <input type="checkbox" id="check" class="cbx-fancy" />
    <label for="check" class="cbx-fancy"></label>
</div>
<div>
    <input type="checkbox" id="check2" class="cbx-button" />
    <label for="check2" class="cbx-button">Checkeame</label>
</div>
<div>
    <input type="radio" id="radio1" name="grupo1" class="cbx-button" />
    <label for="radio1" class="cbx-button">Radio 1</label>
    <input type="radio" id="radio2" name="grupo1" class="cbx-button" />
    <label for="radio2" class="cbx-button">Radio 2</label>
</div>

CSS

div
{
    font-family:Helvetica;
    margin:0.5em 0;
}
input[type].cbx-fancy,input[type].cbx-button
{
    visibility:hidden;
    position:absolute;
}
input.cbx-fancy + label.cbx-fancy{
    background-image:...