Overview

Checkboxes use the .custom-control class as a wrapper. They also both use <input type="checkbox"> and have a <label> with a class of .custom-control-label.

Checkboxes add the .custom-checkbox class to their .custom-control wrapper.

Custom checkboxes can also utilize the :indeterminate pseudo class when manually set via JavaScript (there is no available HTML attribute for specifying it).

<div class="form-group">
  <div class="custom-control custom-checkbox">
    <input type="checkbox" checked class="custom-control-input" id="exampleCheckbox1">
    <label class="custom-control-label" for="exampleCheckbox1">Checkbox</label>
  </div>
  <div class="custom-control custom-checkbox">
    <input type="checkbox" class="custom-control-input" id="exampleCheckbox2">
    <label class="custom-control-label" for="exampleCheckbox2">Checkbox</label>
  </div>
  <div class="custom-control custom-checkbox">
    <input type="checkbox" disabled checked class="custom-control-input" id="exampleCheckbox3">
    <label class="custom-control-label" for="exampleCheckbox3">Disabled</label>
  </div>
  <div class="custom-control custom-checkbox">
    <input type="checkbox" disabled class="custom-control-input" id="exampleCheckbox4">
    <label class="custom-control-label" for="exampleCheckbox4">Disabled</label>
  </div>
  <div class="custom-control custom-checkbox">
    <input type="checkbox" class="custom-control-input" id="exampleCheckbox5">
    <label class="custom-control-label" for="exampleCheckbox5">Indeterminate State</label>
  </div>
</div>

Inline

<div class="custom-control custom-checkbox custom-control-inline mr-3">
  <input type="checkbox" checked class="custom-control-input" id="exampleCheckboxInline1">
  <label class="custom-control-label" for="exampleCheckboxInline1">Checkbox</label>
</div>
<div class="custom-control custom-checkbox custom-control-inline mr-3">
  <input type="checkbox" class="custom-control-input" id="exampleCheckboxInline2">
  <label class="custom-control-label" for="exampleCheckboxInline2">Checkbox</label>
</div>
<div class="custom-control custom-checkbox custom-control-inline mr-3">
  <input type="checkbox" class="custom-control-input" id="exampleCheckboxInline3">
  <label class="custom-control-label" for="exampleCheckboxInline3">Checkbox</label>
</div>