Form Elements

Basic inputs & Textarea

Name

Password

Disabled Input

Textarea

A longer block of help text that breaks onto a new line and may extend beyond one line.

Inputs with floating labels

Select

Basic Select Example

Multiselect Example

Disabled Select

Stacked

Checkboxes are for selecting one or several options in a list, while radios are for selecting one option from many.

Disabled checkboxes and radios are supported, but to provide a "not-allowed" cursor on hover of the parent <label>, you'll need to add the .disabled class to the parent .radio, .radio-inline, .checkbox, or .checkbox-inline.

Option one is this and that—be sure to include why it's great

Option two is disabled

Option one is this and that—be sure to include why it's great

Option two can be something else and selecting it will deselect option one

Option three is disabled

Inline

Use the .checkbox-inline or .radio-inline classes on a series of checkboxes or radios for controls that appear on the same line.

1 2 3

Validation states

Input with success A block of help text that breaks onto a new line and may extend beyond one line.

Input with warning

Input with error

Checkbox with success

Checkbox with warning

Checkbox with error

Input with success

Input with warning

Input with error

Input group with success