.Checkbox {
  background-color: #555;
  transition: --checkbox-tick-color 500ms, background-color 500ms;
}
@supports (background: paint(id)) {
  .is-loaded .Checkbox {
    -webkit-appearance: none;
    background-image: paint(checkbox);
  }
}
.Checkbox:hover {
  --checkbox-tick-color: rgba(255,255,255,.25);
}
.Checkbox:checked {
  --checkbox-tick-color: white;
  background-color: deeppink;
}