# Checkbox

Component: A locked height form component for the collection of one or more on/off or yes/no input values from a set of options. Inner element spacing is used for dynamic resizing along with a background surface.

[Styleguide Link](https://zpl.io/aNYpq7n)

* Parent: Form (Container)
* Child: [Checkbox - Ctrl](../../overview/checkbox), [Label](../../overview/label)

## Properties

### Label

The component can be presented with a label to give context to the checkbox control. This label can be positioned either left align or right.

<figure><img src="https://217329376-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MXJWCEk7b7vvAFeWpr2%2Fuploads%2FGzwdLelhAMZahoTGeMAe%2FLabel.png?alt=media&#x26;token=c338b006-4246-4fea-89e1-592b2940d816" alt=""><figcaption></figcaption></figure>

### Style

The styling of the checkbox can be altered to present a different appearance to the checkbox. For example, a To-Do list being presented with a fancier check than the typical checkbox, but having the same underlying functionality.

<figure><img src="https://217329376-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MXJWCEk7b7vvAFeWpr2%2Fuploads%2FCIKvjg2U7fkKJPF5bpLc%2FStyle.png?alt=media&#x26;token=ba424169-cf46-4430-b610-189ddb27a175" alt=""><figcaption></figcaption></figure>

**Note:** Each of the nested elements and primitives of this form component have properties that can be adjusted to customize the component.
