Individual form controls automatically receive some global styling. All textual input, textarea, and select elements with .form-control are set to width: 100%; by default. Wrap labels and controls in .form-group for optimum spacing.
You can find more example here:

Basic Form

Horizontal Form

Inline Form

Input groups

Extend form controls by adding text or buttons before, after, or on both sides of any text-based input. Use .input-group with an .input-group-addon to prepend or append elements to a .form-control.

Basic Example

$ .00

Checkboxes and Radio Addons

Button Addons and Buttons with Dropdowns

Buttons in input groups are a bit different and require one extra level of nesting. Instead of .input-group-addon, you'll need to use .input-group-btn to wrap the buttons. This is required due to default browser styles that cannot be overridden.

Standard Form Controls


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.

Checkboxes and Radios


Use the default option, or add multiple to show multiple options at once.

Validation States

Bootstrap includes validation styles for error, warning, and success states on form controls. To use, add .has-warning, .has-error, or .has-success to the parent element. Any .control-label, .form-control, and .help-block within that element will receive the validation styles.

Control Sizing

Control Sizing

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

General Ultimate Forms
Note: works in Chrome, Firefox, Opera and IE10.
Note: hold down the ctrl/cmd button to select multiple options.
Note: height of the textarea depends on the rows attribute.
Note: expands on focus.
Note: you can use more than 350 icons for rating
Form Icons and placeholders
Form Tooltips
Responsive grid system
Available validation rules
Available masking rules
Registration form
Login form
Password recovery

Your request successfully sent!
Close window

Contacts form

Your message was successfully sent!

Comment form
You may use these HTML tags and attributes: <a href="" title="">, <abbr title="">, <acronym title="">, <b>, <blockquote cite="">, <cite>, <code>, <del datetime="">, <em>, <i>, <q cite="">, <strike>, <strong>.

Your comment was successfully added!

Checkout form
Order Form

Thanks for your order!
We'll contact you very soon.

Review form
Quality of the product
Reliability of the product
Overall rating
Success states for elements
This is a required field.
This is a required field.
Thanks for your selection.
Thanks for your text.
Thanks for your selection.
Thanks for your selection.
Thanks for your selection.
Thanks for your selection.
Error states for elements
This is a required field.
File size must be less than 3Mb.
You must select an option.
This is a required field.
You must select one option.
You must select at least one option.
You must select one option.
You must select at least one option.
Disabled states for elements
Slider Forms
Rounded Slider Forms

Bootstrap Modals

The modal plugin toggles your hidden content on demand, via data attributes or JavaScript. It also adds .modal-open to the <body> to override default scrolling behavior and generates a .modal-backdrop to provide a click area for dismissing shown modals when clicking outside the modal. You can find more detailed information from the offecial Bootstrap website

Bootstrap Modals With Forms

You are alos able to use Bootstrap Modals with forms. Here is an examples of Bootstrap Modal forms: