Checkbox

A checkbox is an input control that allows the user to give a feedback by choosing several items from a list of options. For example, you can use checkbox when user may have to select multiple options from a list of items, or when an explicit action is required to apply the settings in your product.

React

Angular

Example

Wonderful choice

<div class="nj-checkbox">
  <label>
    <input type="checkbox"> Wonderful choice
  </label>
</div>

<form>
  <div class="nj-form-group">
    <div class="nj-checkbox">
      <label>
        <input type="checkbox"> Wonderful choice
      </label>
    </div>
    <div class="nj-checkbox">
      <label>
        <input type="checkbox"> Bad choice
      </label>
    </div>
    <div class="nj-checkbox nj-checkbox--disabled">
      <label>
        <input type="checkbox" disabled> Disabled choice
      </label>
    </div>
  </div>
  <div class="nj-checkbox nj-checkbox--inline">
    <label>
      <input type="checkbox"> Inline choice 1
    </label>
  </div>
  <div class="nj-checkbox nj-checkbox--inline">
    <label>
      <input type="checkbox"> Inline choice 2
    </label>
  </div>
  <div class="nj-checkbox nj-checkbox--inline nj-checkbox--disabled">
    <label>
      <input type="checkbox" disabled> Inline choice 3 disabled
    </label>
  </div>
</form>

Cards

Collapse