<div>Check me!</div> <input id="trigger" type="checkbox"> <label for="trigger" class="checker"></label>
#trigger { display: none; } .checker { background-image: url(assets/checkboxes.png); background-position: left center; background-size: auto 100%; width: 40px; height: 40px; background-repeat: no-repeat; } #trigger:checked + .checker { background-position: right center; }