# Checkbox
**This documentation is fully rendered on the
[Material Web catalog](https://material-web.dev/components/checkbox/).**
[Checkboxes](https://m3.material.io/components/checkbox) allow users
to select one or more items from a set. Checkboxes can turn an option on or off.
There's one type of checkbox in Material. Use this selection control when the
user needs to select one or more options from a list.
* [Design article](https://m3.material.io/components/checkbox)
* [API Documentation](#api)
* [Source code](https://github.com/material-components/material-web/tree/main/checkbox)
## Usage
Checkboxes may be standalone, pre-checked, or indeterminate.

```html
```
### Label
Associate a label with a checkbox using the `` element.

```html
Checkbox one
Checkbox two
```
## Accessibility
Add an
[`aria-label`](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label)
attribute to checkboxes without labels or checkboxes whose labels need to be
more descriptive.
```html
Agree
```
> Note: checkboxes are not automatically labelled by `` elements and
> always need an `aria-label`. See b/294081528.
## Theming
Checkbox supports [Material theming](../theming/README.md) and can be customized
in terms of color and shape.
### Tokens
Token | Default value
---------------------------------------- | -----------------------------------
`--md-checkbox-outline-color` | `--md-sys-color-on-surface-variant`
`--md-checkbox-selected-container-color` | `--md-sys-color-primary`
`--md-checkbox-selected-icon-color` | `--md-sys-color-on-primary`
`--md-checkbox-container-shape` | `2px`
* [All tokens](https://github.com/material-components/material-web/blob/main/tokens/_md-comp-checkbox.scss)
### Example

```html
```
## API
### MdCheckbox <md-checkbox>
#### Properties
| Property | Attribute | Type | Default | Description |
| --- | --- | --- | --- | --- |
| `checked` | `checked` | `boolean` | `false` | Whether or not the checkbox is selected. |
| `indeterminate` | `indeterminate` | `boolean` | `false` | Whether or not the checkbox is indeterminate. https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#indeterminate_state_checkboxes |
| `required` | `required` | `boolean` | `false` | When true, require the checkbox to be selected when participating in form submission. https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#validation |
| `value` | `value` | `string` | `'on'` | The value of the checkbox that is submitted with a form when selected. https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#value |
| `disabled` | | `boolean` | `undefined` | |
| `name` | | `string` | `undefined` | |
#### Methods
| Method | Parameters | Returns | Description |
| --- | --- | --- | --- |
| `formResetCallback` | _None_ | `void` | |
| `formStateRestoreCallback` | `state` | `void` | |
#### Events
| Event | Type | [Bubbles](https://developer.mozilla.org/en-US/docs/Web/API/Event/bubbles) | [Composed](https://developer.mozilla.org/en-US/docs/Web/API/Event/composed) | Description |
| --- | --- | --- | --- | --- |
| `change` | `Event` | Yes | No | The native `change` event on [` `](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event) |
| `input` | `InputEvent` | Yes | Yes | The native `input` event on [` `](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event) |