Checks & Radios

Bootstrap docs: https://getbootstrap.com/docs/5.3/forms/checks-radios/

MDBootstrap docs: https://mdbootstrap.com/docs/standard/forms/checkbox/

Checkboxes
  
  
<!-- Default checkbox -->
<div class="form-check">
  <input
    class="form-check-input"
    type="checkbox"
    value=""
    id="flexCheckDefault"
  />
  <label class="form-check-label" for="flexCheckDefault">
    Default checkbox
  </label>
</div>
  
Radio buttons
  
  
<!-- Default radio -->
<div class="form-check">
  <input
    class="form-check-input"
    type="radio"
    name="flexRadioDefault"
    id="flexRadioDefault1"
  />
  <label class="form-check-label" for="flexRadioDefault1">
    Default radio
  </label>
</div>
  
Inline

Group checkboxes or radios on the same horizontal row by adding .form-check-inline to any .form-check container.

  
  
<div class="form-check form-check-inline">
  <input
    class="form-check-input"
    type="checkbox"
    id="inlineCheckbox1"
    value="option1"
  />
  <label class="form-check-label" for="inlineCheckbox1">1</label>
</div>

<div class="form-check form-check-inline">
  <input
    class="form-check-input"
    type="checkbox"
    id="inlineCheckbox2"
    value="option2"
  />
  <label class="form-check-label" for="inlineCheckbox2">2</label>
</div>

<div class="form-check form-check-inline">
  <input
    class="form-check-input"
    type="checkbox"
    id="inlineCheckbox3"
    value="option3"
    disabled
  />
  <label class="form-check-label" for="inlineCheckbox3"
    >3 (disabled)</label
  >
</div>