### Basic checkbox:

```jsx
const handleChange = (value, { target: { name } }) => {
  console.log(value, name);
  setState({ [name]: value });
};

<div>
  <Checkbox
    id="basic1"
    name="basic1"
    value={state.basic1}
    intent="info"
    size="small"
    onChange={handleChange}
  >
    Info default
  </Checkbox>
  <Checkbox
    id="basic2"
    name="basic2"
    value={state.basic2}
    intent="warning"
    size="normal"
    onChange={handleChange}
  >
    Warning default
  </Checkbox>

  <Checkbox
    id="basic3"
    name="basic3"
    value={state.basic3}
    intent="danger"
    size="large"
    onChange={handleChange}
  >
    Danger default
  </Checkbox>
</div>;
```

### Disabled state:

```jsx
<div>
  <Checkbox id="basic" value tabIndex="1" disabled>
    Default
  </Checkbox>

  <Checkbox id="basic" value intent="primary" disabled>
    Primary
  </Checkbox>

  <Checkbox id="basic" value intent="success" disabled>
    Success
  </Checkbox>

  <Checkbox id="basic" value intent="info" disabled>
    Info
  </Checkbox>

  <Checkbox id="basic" value intent="warning" disabled>
    Warning
  </Checkbox>

  <Checkbox id="basic" value intent="danger" disabled>
    Danger
  </Checkbox>

  <Checkbox
    id="basic1"
    value
    tabIndex="1"
    round
    disabled
    onChange={() => setState({ value: !state.value })}
  >
    Default
  </Checkbox>

  <Checkbox
    id="basic1"
    value
    intent="primary"
    round
    disabled
    onChange={() => setState({ value: !state.value })}
  >
    Primary
  </Checkbox>

  <Checkbox
    id="basic1"
    value
    intent="success"
    round
    disabled
    onChange={() => setState({ value: !state.value })}
  >
    Success
  </Checkbox>

  <Checkbox
    id="basic1"
    value
    intent="info"
    round
    disabled
    onChange={() => setState({ value: !state.value })}
  >
    Info
  </Checkbox>

  <Checkbox
    id="basic1"
    value
    intent="warning"
    round
    disabled
    onChange={() => setState({ value: !state.value })}
  >
    Warning
  </Checkbox>

  <Checkbox
    id="basic1"
    value
    intent="danger"
    round
    disabled
    onChange={() => setState({ value: !state.value })}
  >
    Danger
  </Checkbox>
</div>
```

### Round shape:

```jsx
initialState = { value: true };

<div>
  <Checkbox
    id="basic3"
    value={state.value}
    tabIndex="1"
    round
    size="small"
    onChange={() => setState({ value: !state.value })}
  >
    Default small round
  </Checkbox>

  <Checkbox
    id="basic3"
    value={state.value}
    intent="primary"
    round
    size="small"
    onChange={() => setState({ value: !state.value })}
  >
    Primary small round
  </Checkbox>

  <Checkbox
    id="basic3"
    value={state.value}
    intent="success"
    round
    size="small"
    onChange={() => setState({ value: !state.value })}
  >
    Success small round
  </Checkbox>

  <Checkbox
    id="basic3"
    value={state.value}
    intent="info"
    round
    size="small"
    onChange={() => setState({ value: !state.value })}
  >
    Info small round
  </Checkbox>

  <Checkbox
    id="basic3"
    value={state.value}
    intent="warning"
    round
    size="small"
    onChange={() => setState({ value: !state.value })}
  >
    Warning small round
  </Checkbox>

  <Checkbox
    id="basic3"
    value={state.value}
    intent="danger"
    round
    size="small"
    onChange={() => setState({ value: !state.value })}
  >
    Danger small round
  </Checkbox>

  <Checkbox
    id="basic3"
    value={state.value}
    tabIndex="1"
    round
    onChange={() => setState({ value: !state.value })}
  >
    Default round
  </Checkbox>

  <Checkbox
    id="basic3"
    value={state.value}
    intent="primary"
    round
    onChange={() => setState({ value: !state.value })}
  >
    Primary round
  </Checkbox>

  <Checkbox
    id="basic3"
    value={state.value}
    intent="success"
    round
    onChange={() => setState({ value: !state.value })}
  >
    Success round
  </Checkbox>

  <Checkbox
    id="basic3"
    value={state.value}
    intent="info"
    round
    onChange={() => setState({ value: !state.value })}
  >
    Info round
  </Checkbox>

  <Checkbox
    id="basic3"
    value={state.value}
    intent="warning"
    round
    onChange={() => setState({ value: !state.value })}
  >
    Warning round
  </Checkbox>

  <Checkbox
    id="basic3"
    value={state.value}
    intent="danger"
    round
    onChange={() => setState({ value: !state.value })}
  >
    Danger round
  </Checkbox>

  <Checkbox
    id="basic3"
    value={state.value}
    tabIndex="1"
    round
    size="large"
    onChange={() => setState({ value: !state.value })}
  >
    Default large round
  </Checkbox>

  <Checkbox
    id="basic3"
    value={state.value}
    intent="primary"
    round
    size="large"
    onChange={() => setState({ value: !state.value })}
  >
    Primary large round
  </Checkbox>

  <Checkbox
    id="basic3"
    value={state.value}
    intent="success"
    round
    size="large"
    onChange={() => setState({ value: !state.value })}
  >
    Success large round
  </Checkbox>

  <Checkbox
    id="basic3"
    value={state.value}
    intent="info"
    round
    size="large"
    onChange={() => setState({ value: !state.value })}
  >
    Info large round
  </Checkbox>

  <Checkbox
    id="basic3"
    value={state.value}
    intent="warning"
    round
    size="large"
    onChange={() => setState({ value: !state.value })}
  >
    Warning large round
  </Checkbox>

  <Checkbox
    id="basic3"
    value={state.value}
    intent="danger"
    round
    size="large"
    onChange={() => setState({ value: !state.value })}
  >
    Danger large round
  </Checkbox>
</div>;
```
