Checkbox buttons

Bootstrap 5 Checkbox buttons component

Responsive Checkbox buttons built with Bootstrap 5. A simple example of how to get a button that is also a checkbox.

Basic example

MDB’s .btn styles can be applied to <label>s, to provide checkbox style button toggling. Add an input with a .btn-check class as previous sibling to toggle the input state.

Edit in sandbox 
        
            
      <input type="checkbox" data-mdb-ripple-init class="btn-check" id="btn-check" autocomplete="off" />
      <label data-mdb-ripple-init class="btn btn-primary" for="btn-check">Checkbox button</label>

      <input type="checkbox" data-mdb-ripple-init class="btn-check" id="btn-check2" checked autocomplete="off" />
      <label data-mdb-ripple-init class="btn btn-primary" for="btn-check2">Checkbox button</label>

      <input type="checkbox" data-mdb-ripple-init class="btn-check" id="btn-check3" autocomplete="off" />
      <label data-mdb-ripple-init class="btn btn-primary" for="btn-check3">Checkbox button</label>