Increasing the size of a bootstrap checkbox

I am creating a simple check box with the code from the official bootstrap documentation:

<div class="custom-control custom-checkbox">
    <input type="checkbox" class="custom-control-input" id="customCheck" name="example1">
    <label class="custom-control-label" for="customCheck">Check this custom checkbox</label>
</div>

I am wondering how to make the checkbox larger than it currently is? I have tried editing the css of customCheck and changing the height and width properties, but that does not increase the size of the box.

Answer

It is not a good idea to change bootstrap components dimensions, you should change variables in bootstrap but it means to recompile library. Anyway what you want can be done i this way:

.custom-control-label::before ,.custom-control-label::after{width:20px; height:20px}