<div class="form-group">    <div class="custom-control custom-checkbox">        <input type="checkbox" class="custom-control-input" id="customCheck" checked>        <label class="custom-control-label" for="customCheck">Check this custom checkbox - Default</label>    </div></div><div class="form-group">    <div class="custom-control custom-checkbox custom-checkbox-secondary">        <input type="checkbox" class="custom-control-input" id="customCheck1" checked>        <label class="custom-control-label" for="customCheck1">Check this custom checkbox - Secondary</label>    </div></div><div class="form-group">    <div class="custom-control custom-checkbox custom-checkbox-success">        <input type="checkbox" class="custom-control-input" id="customCheck2" checked>        <label class="custom-control-label" for="customCheck2">Check this custom checkbox - Success</label>    </div></div><div class="form-group">    <div class="custom-control custom-checkbox custom-checkbox-danger">        <input type="checkbox" class="custom-control-input" id="customCheck3" checked>        <label class="custom-control-label" for="customCheck3">Check this custom checkbox - Danger</label>    </div></div><div class="form-group">    <div class="custom-control custom-checkbox custom-checkbox-warning">        <input type="checkbox" class="custom-control-input" id="customCheck4" checked>        <label class="custom-control-label" for="customCheck4">Check this custom checkbox - Warning</label>    </div></div><div class="form-group">    <div class="custom-control custom-checkbox custom-checkbox-info">        <input type="checkbox" class="custom-control-input" id="customCheck5" checked>        <label class="custom-control-label" for="customCheck5">Check this custom checkbox - Info</label>    </div></div><div class="form-group">    <div class="custom-control custom-checkbox custom-checkbox-dark">        <input type="checkbox" class="custom-control-input" id="customCheck6" checked>        <label class="custom-control-label" for="customCheck6">Check this custom checkbox - Dark</label>    </div></div>

<div class="form-group">    <div class="custom-control custom-radio">        <input type="radio" id="customRadio" name="customRadio" class="custom-control-input" checked>        <label class="custom-control-label" for="customRadio">Toggle this custom radio - Default</label>    </div></div><div class="form-group">    <div class="custom-control custom-radio custom-checkbox-secondary">        <input type="radio" id="customRadio1" name="customRadio" class="custom-control-input">        <label class="custom-control-label" for="customRadio1">Toggle this custom radio - Secondary</label>    </div></div><div class="form-group">    <div class="custom-control custom-radio custom-checkbox-success">        <input type="radio" id="customRadio2" name="customRadio" class="custom-control-input">        <label class="custom-control-label" for="customRadio2">Toggle this custom radio - Success</label>    </div></div><div class="form-group">    <div class="custom-control custom-radio custom-checkbox-danger">        <input type="radio" id="customRadio3" name="customRadio" class="custom-control-input">        <label class="custom-control-label" for="customRadio3">Toggle this custom radio - Danger</label>    </div></div><div class="form-group">    <div class="custom-control custom-radio custom-checkbox-warning">        <input type="radio" id="customRadio4" name="customRadio" class="custom-control-input">        <label class="custom-control-label" for="customRadio4">Toggle this custom radio -            Warning</label>    </div></div><div class="form-group">    <div class="custom-control custom-radio custom-checkbox-info">        <input type="radio" id="customRadio5" name="customRadio" class="custom-control-input">        <label class="custom-control-label" for="customRadio5">Toggle this custom radio - Info</label>    </div></div><div class="form-group">    <div class="custom-control custom-radio custom-checkbox-dark">        <input type="radio" id="customRadio6" name="customRadio" class="custom-control-input">        <label class="custom-control-label" for="customRadio6">Toggle this custom radio -Dark</label>    </div></div>

<div class="form-group">    <div class="custom-control custom-switch">        <input type="checkbox" class="custom-control-input" id="customSwitch1" checked>        <label class="custom-control-label" for="customSwitch1">Toggle this switch element - Default</label>    </div></div><div class="form-group">    <div class="custom-control custom-switch custom-checkbox-secondary">        <input type="checkbox" class="custom-control-input" id="customSwitch2" checked>        <label class="custom-control-label" for="customSwitch2">Toggle this switch element - Secondary</label>    </div></div><div class="form-group">    <div class="custom-control custom-switch custom-checkbox-success">        <input type="checkbox" class="custom-control-input" id="customSwitch3" checked>        <label class="custom-control-label" for="customSwitch3">Toggle this switch element - Success</label>    </div></div><div class="form-group">    <div class="custom-control custom-switch custom-checkbox-danger">        <input type="checkbox" class="custom-control-input" id="customSwitch4" checked>        <label class="custom-control-label" for="customSwitch4">Toggle this switch element - Danger</label>    </div></div><div class="form-group">    <div class="custom-control custom-switch custom-checkbox-warning">        <input type="checkbox" class="custom-control-input" id="customSwitch5" checked>        <label class="custom-control-label" for="customSwitch5">Toggle this switch element - Warning</label>    </div></div><div class="form-group">    <div class="custom-control custom-switch custom-checkbox-info">        <input type="checkbox" class="custom-control-input" id="customSwitch6" checked>        <label class="custom-control-label" for="customSwitch6">Toggle this switch element - Info</label>    </div></div><div class="form-group">    <div class="custom-control custom-switch custom-checkbox-dark">        <input type="checkbox" class="custom-control-input" id="customSwitch7" checked>        <label class="custom-control-label" for="customSwitch7">Toggle this switch element - Dark</label>    </div></div>

<div class="custom-control custom-checkbox custom-control-inline">    <input type="checkbox" id="customCheckBoxInline1" name="customCheckboxInline1" class="custom-control-input">    <label class="custom-control-label" for="customCheckBoxInline1">Check this custom checkbox</label></div><div class="custom-control custom-checkbox custom-control-inline">    <input type="checkbox" id="customCheckBoxInline2" name="customCheckboxInline2" class="custom-control-input">    <label class="custom-control-label" for="customCheckBoxInline2">Check this custom checkbox</label></div><div class="custom-control custom-radio custom-control-inline">    <input type="radio" id="customRadioInline1" name="customRadioInline1" class="custom-control-input">    <label class="custom-control-label" for="customRadioInline1">Toggle this custom radio</label></div><div class="custom-control custom-radio custom-control-inline">    <input type="radio" id="customRadioInline2" name="customRadioInline1" class="custom-control-input">    <label class="custom-control-label" for="customRadioInline2">Or toggle this other custom radio</label></div><div class="custom-control custom-switch custom-control-inline">    <input type="checkbox" class="custom-control-input" id="customSwitchInline1">    <label class="custom-control-label" for="customSwitchInline1">Disabled switch element</label></div><div class="custom-control custom-switch custom-control-inline">    <input type="checkbox" class="custom-control-input" id="customSwitchInline2">    <label class="custom-control-label" for="customSwitchInline2">Disabled switch element</label></div>

<!-- Checkbox --><div class="custom-control custom-checkbox">    <input type="checkbox" class="custom-control-input" id="customCheckDisabled" disabled>    <label class="custom-control-label" for="customCheckDisabled">Check this custom checkbox</label></div><!-- Radio --><div class="custom-control custom-radio">    <input type="radio" name="radioDisabled" id="customRadioDisabled" class="custom-control-input" disabled>    <label class="custom-control-label" for="customRadioDisabled">Toggle this custom radio</label></div><!-- Switch --><div class="custom-control custom-switch">    <input type="checkbox" class="custom-control-input" disabled id="customSwitchDisabled">    <label class="custom-control-label" for="customSwitchDisabled">Disabled switch element</label></div>

<select class="custom-select custom-select-lg">  <option selected>Open this select menu</option>  <option value="1">One</option>  <option value="2">Two</option>  <option value="3">Three</option></select><select class="custom-select mb-3">  <option selected>Open this select menu</option>  <option value="1">One</option>  <option value="2">Two</option>  <option value="3">Three</option></select><select class="custom-select custom-select-sm">  <option selected>Open this select menu</option>  <option value="1">One</option>  <option value="2">Two</option>  <option value="3">Three</option></select>

<div class="form-group">    <label for="customRange1">Default</label>    <input type="range" class="custom-range" id="customRange1"></div><div class="form-group">    <label for="customRange6">Secondary</label>    <input type="range" value="20" class="custom-range custom-range-secondary" id="customRange6"></div><div class="form-group">    <label for="customRange7">Success</label>    <input type="range" value="70" class="custom-range custom-range-success" id="customRange7"></div><div class="form-group">    <label for="customRange9">Danger</label>    <input type="range" value="30" class="custom-range custom-range-danger" id="customRange9"></div><div class="form-group">    <label for="customRange2">Warning</label>    <input type="range" value="50" class="custom-range custom-range-warning" id="customRange2"></div><div class="form-group">    <label for="customRange8">Info</label>    <input type="range" class="custom-range custom-range-info" id="customRange8"></div><div class="form-group">    <label for="customRange3">Dark</label>    <input type="range" value="10" class="custom-range custom-range-dark" id="customRange3"></div>

<div class="custom-file">  <input type="file" class="custom-file-input" id="customFile">    <label class="custom-file-label" for="customFile">Choose file</label></div>