<input type="checkbox" id="spin1" />
<label for="spin1">Spin!</label>
<input type="checkbox" id="spin2" />
<label for="spin2">Spin again!</label>
<div>🐶</div>

body { font-size: 32px; }
input { height: 32px; width: 32px; }
div { font-size: 64px; width: fit-content; }

:checked ~ div {
  animation-delay: 0s;
  animation-duration: 0.5s;
  animation-iteration-count: 1;
}

#spin1:checked ~ div {
  animation-name: spin1;
}
#spin2:checked ~ div {
  animation-name: spin2;
}

@keyframes spin1 {
  to {
    transform: rotate(360deg);
  }
}
@keyframes spin2 {
  to {
    transform: rotate(360deg);
  }
}