SOURCE

<label for="checkbox1" class="checkbox">
  <input id="checkbox1" type="checkbox" style="display: none;"/>
  <i class="icon ico-checkbox"></i> <span>Click Me!</span>
</label>

label.checkbox {
	font-size: 30px;
	line-height: 40px;
  margin-left: 30px;
}
i.icon:before {
  width: 1em;
  display: inline-block;
	content: " ";
}
.icon.ico-checkbox {
  background: no-repeat center url(//www.easyicon.net/api/resizeApi.php?id=11633&size=32);
  background-size: 100%;
}
input:checked + .ico-checkbox {
  background: no-repeat center url(//www.easyicon.net/api/resizeApi.php?id=3888&size=32);
  background-size: 100%;
}