Add .checkbox as a single wrapper and add <label> with for attribute to get better output.

• Active
• Inactive
• Checked - disabled
• Unchecked - disabled

Add .custom-control.custom-checkbox as a single wrapper and add .custom-control-label for better output.

• Active
• Inactive
• Active - disabled
• Inactive - disabled

Add .checkbox.checkbox-{color} in the wrapper for colored checkbox.

• Primary
• Secondary
• Success
• Danger
• Warning
• Info

Use .checkbox.checkbox-sm in the wrapper for small checkbox. Colored small checkbox can also be used.

• Small
• Default