Starx

You cannot change the content the label itself, but you can control the content of the pseudo element after and before. You can add the logic of square/circle with something that can represent check and uncheck.

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

input[type='checkbox']:checked + label:after {
  content: "checked";
}

Demo

To answer your question in the comment

How they make funky circle buttons and put a checkbox inside it when one clicks?

You can use CSS animations. The label will already have the check symbol in it but won’t have shown in the unchecked state of the input box. And when the element is checked, it will change the opacity to 1, showing the checkbox in an animated way.

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;
}

Demo