Form Elements

Simple Input

Placeholder

Input Focus

Search

Different Color Input

File Upload

Upload
Upload
Upload
Upload
Upload

Disable

Size

Textarea

Select

Input Group

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.

@domain.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.

@
@
@

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 And Radio Button

Checkboxes

Add class .checkbox-customto make it.

Radios

Add class .radio-customto make it.

Different color radio and checkbox

Add class .radio and .checkbox to make it.