JSFiddle - React, Tailwind, and code Playground

HTML

<label class="custom">
    <input type="checkbox"/>
	<span></span>
</label>
<label class="custom">
    <input type="checkbox"/>
	<span></span>
</label>
<label class="custom">
    <input type="checkbox"/>
	<span></span>
</label>

CSS

label.custom {
    display: inline-block;
    cursor: pointer;
}

label.custom > input[type=checkbox] {
	display: none;
}

label.custom > span {
    display: block;
    background: url(http://smart-yacht.ru/assets/img/checkbox2.png);
    width: 19px;
    height: 21px;
}

label.custom input[type=checkbox]:checked + span {
    background-position: 0px -50px;
}