Form Elements

Rounded Input

Disable

Input Focus

Placeholder

Static Control

email@example.com

File Upload

With Help

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

Search

Size

Select

Textarea

Input Groups

Checkbox And Radio

Place any checkbox or radio option within an input group's addon instead of text.

Text Addon

Place one add-on or button on either side of an input. You may also place one on both sides of an input.

@example.com
$
$ .00

Icon Addon

Place icon instead of text in add-on on either side of an input. You may also place one on both sides of an input.

Button Addon

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.

Buttons With Dropdowns

Place any button or drodowns within an input group's addon instead of text.

Size

Add the relative form sizing classes to the .input-group itself and contents within will automatically resize—no need for repeating the form control size classes on each element.

@
@
@

Checkbox & Radio official website

Checkboxes

Add class .checkbox-customto make it.

Radios

Add class .radio-customto make it.

Color Options

Add class .checkbox-default, .checkbox-primary, .checkbox-success, .checkbox-info, .checkbox-warning, .checkbox-danger, to change styles.

Form icons

Left icon

right icon

red icon

blue icon

purple icon

green icon

blue-grey icon

left large

left large

left small

round input

change icon