JSFiddle - React, Tailwind, and code Playground

HTML

<input id="test" type="checkbox">
<label for="test">label</label>

CSS

input[type='checkbox'] {
  width: 0;
  height: 0;
}

input[type='checkbox'] + label:after {
  content: "checked";
  opacity: 0;
  -webkit-transition: all 0.50s; 
  -moz-transition: all 0.50s;
  -o-transition: all 0.50s;
  transition: all 0.50s;
}
input[type='checkbox']:checked + label:after {
  opacity: 1;
}