How to change bootstrap checkbox size

The best way to change the bootstrap checkbox size in CSS is by using the scale property.

<div class="form-check">
  <input class="form-check-input" type="checkbox" value="" id="checkbox-1" checked/>
  <label class="form-check-label" for="checkbox-1">Regular checkbox</label>
</div>
  <!-- Checked checkbox -->
<div class="form-check checkbox-lg">
  <input class="form-check-input" type="checkbox" value="" id="checkbox-2" checked/>
  <label class="form-check-label" for="checkbox-2">Large checkbox</label>
</div>
  <!-- Checked checkbox -->
<div class="form-check checkbox-xl">
  <input class="form-check-input" type="checkbox" value="" id="checkbox-3" checked/>
  <label class="form-check-label" for="checkbox-3">Extra large checkbox</label>
</div>
.checkbox-lg .form-check-input{
 top: .8rem;
 scale: 1.4;
 margin-right: 0.7rem;
 }

.checkbox-lg .form-check-label {
 padding-top: 13px;
 }

.checkbox-xl .form-check-input {
 top: 1.2rem;
 scale: 1.7;
 margin-right: 0.8rem;
 }

.checkbox-xl .form-check-label {
 padding-top: 19px;
 }