To create a custom checkbox, wrap a container element, with a class of .custom-control and .custom-checkbox around the checkbox. Then add the .custom-control-input to the input with type="checkbox".
Checkbox with label
<label class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input">
<span class="custom-control-label">Normal </span>
</label>
<label class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" checked="">
<span class="custom-control-label">Checked</span>
</label>
<label class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" disabled="">
<span class="custom-control-label">Disabled Normal</span>
</label>
<label class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" disabled="" checked="">
<span class="custom-control-label">Disabled Checked</span>
</label>
Checkbox without label
<label class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input">
<span class="custom-control-label"></span>
</label>
<label class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" checked="">
<span class="custom-control-label"></span>
</label>
<label class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" disabled="">
<span class="custom-control-label"></span>
</label>
<label class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input disabled" disabled="" checked="">
<span class="custom-control-label"></span>
</label>