Form Elements

Textual inputs

Here are examples of .form-control applied to each textual HTML5 <input> type.

Input Sizing

Set heights using classes like .form-control-lg and .form-control-sm.

Default Input
Form Control Sm
Form Control Lg

Custom Form

Add .form-group-custom class with .form-group for a custom Form.

Range Inputs

Set horizontally scrollable range inputs using .form-control-range.

Custom Range


Default Checkboxes
Custom Checkboxes
Inline Checkboxes
Custom Inline Checkboxes


Default Radios
Custom Radios
Inline Radios
Custom Inline Radios

Inline Forms

Use the .form-inline class to display a series of labels, form controls, and buttons on a single horizontal row.


Auto sizing