JSFiddle - React, Tailwind, and code Playground

HTML

С label 

<form>
  <label><input type="checkbox" name="a" value="1">Checkbox 1</label>
  <label><input type="checkbox" name="a" value="2">Checkbox 2</label>
  <label><input type="checkbox" name="a" value="3">Checkbox 3</label>
</form>

Без label 

<form>
  <input type="checkbox" name="a" value="1">Checkbox 1
  <input type="checkbox" name="a" value="2">Checkbox 2
  <input type="checkbox" name="a" value="3">Checkbox 3
</form>

CSS

input[type="checkbox"]:focus {
  background: yellow;
  border: 1px solid red;
  width: 30px;
  height: 30px;
}