Form Elements page header description goes here...


Most common form control, text-based input fields. Includes support for all HTML5 types: text, password, datetime, datetime-local, date, month, time, week, number, email, url, search, tel, and color.


Form control which supports multiple lines of text. Change rows attribute as necessary.


Note that many native select menus—namely in Safari and Chrome—have rounded corners that cannot be modified via border-radius properties.

For <select> controls with the multiple attribute, multiple options are shown by default.


Checkboxes are for selecting one or several options in a list and we styled it with CSS and Glyphicon.

Add .checkbox-success or other bootstrap color class to change the checkbox checked color.


Radios use for selecting one option from many. You may add .disabled class to the wrapper of the radios.

Add .radio-success or other bootstrap color class to change the radio checked color.

Validation States

Looks good!
Please choose a username.
Please enter a message in the textarea.

Control Sizing

Set heights using classes like .form-control-lg, and set widths using grid column classes like .col-lg-*.

Default Form

All textual <input>, <textarea>, and <select> elements with .form-control are set to width: 100%; by default.

Horizontal Form

Use Bootstrap's predefined grid classes to align labels and groups of form controls in a horizontal layout by adding .form-horizontal to the form.

Inline Form

Add .form-inline to your form (which doesn't have to be a <form>) for left-aligned and inline-block controls. This only applies to forms within viewports that are at least 768px wide.

Color Theme
Gradient Theme
Fixed Sidebar
Light Sidebar
Fixed Header
Dark Header