Forms
Checkboxes
Expand
Collapse
Checkboxes
Default checkbox
Checked checkbox
Indeterminate state
Indeterminate checkbox
Disabled
Disabled checkbox
Disabled checked checkbox
Inline
1
2
3 (disabled)
Without label
Switches
Default switch checkbox input
Checked switch checkbox input
Disabled switch checkbox input
Disabled checked switch checkbox input
Toggle buttons
Single toggle
Checked
Disabled
Disabled Checked
Single toggle
Outline Checked
Outline Disabled
Outline Checked Disabled
Floating Labels
Expand
Collapse
Email address
Password
Input with value
Invalid input
Textareas
Comments
Selects
Open this select menu
One
Two
Three
Works with selects
Layout
Email address
Open this select menu
One
Two
Three
Works with selects
Input Group
Expand
Collapse
@
@example.com
Your vanity URL
https://example.com/users/
$
.00
@
With textarea
No wrap
@
Sizing
Small
Default
Large
Checkboxes and radios
Multiple inputs
First and last name
Multiple addons
$
0.00
$
0.00
Button addons
Button
Button
Button
Button
Button
Button
Buttons with dropdowns
Dropdown
Action
Another action
Something else here
Separated link
Dropdown
Action
Another action
Something else here
Separated link
Dropdown
Action before
Another action before
Something else here
Separated link
Dropdown
Action
Another action
Something else here
Separated link
Segmented buttons
Dropdown
Action
Another action
Something else here
Separated link
Dropdown
Action
Another action
Something else here
Separated link
Dropdown
Action before
Another action before
Something else here
Separated link
Dropdown
Action
Another action
Something else here
Separated link
Custom select
Options
Choose...
One
Two
Three
Choose...
One
Two
Three
Options
Button
Choose...
One
Two
Three
Choose...
One
Two
Three
Button
Custom file input
Upload
Upload
Button
Button
Layout
Expand
Collapse
Margin utilities
Example label
Another label
Form grid
Gutters
Email
Password
Address
Address 2
City
State
Choose...
...
Zip
Check me out
Sign in
Horizontal
UUN
Email
Password
Radios
First radio
Second radio
Third disabled radio
Example checkbox
Sign in
Horizontal label sizing
Email
Email
Email
Column sizing
Auto sizing
Name
Username
@
Preference
Choose...
One
Two
Three
Remember me
Submit
Mixed column widths
Name
Username
@
Preference
Choose...
One
Two
Three
Remember me
Submit
Inline
Username
@
Preference
Choose...
One
Two
Three
Remember me
Submit
Radios
Expand
Collapse
Radios
Default radio
Default checked radio
Disabled
Disabled radio
Disabled checked radio
Inline
1
2
3 (disabled)
Without label
Toggle buttons
Checked
Radio
Disabled
Radio
Checked success radio
Danger radio
Range
Expand
Collapse
Range input
Example range
Disabled
Disabled range
Min and max
Example range
Steps
Example range
Search input
Expand
Collapse
Validation
Expand
Collapse
First name *
Looks good!
Last name *
Looks good!
Username *
@
Please choose a username.
City *
Please provide a valid city.
State *
Choose...
...
Please select a valid state.
Zip *
Please provide a valid zip.
Agree to terms and conditions *
You must agree before submitting.
Submit form
Browser defaults
First name *
Last name *
Username *
@
City *
State *
Choose...
...
Zip *
Agree to terms and conditions *
Submit form
Server side
First name *
Looks good!
Last name *
Looks good!
Username *
@
Please choose a username.
City *
Please provide a valid city.
State *
Choose...
...
Please select a valid state.
Zip *
Please provide a valid zip.
Agree to terms and conditions
You must agree before submitting.
Submit form
Supported elements
Textarea *
Please enter a message in the textarea.
Check this checkbox *
Example invalid feedback text
Toggle this radio
Or toggle this other radio
More example invalid feedback text
Open this select menu
One
Two
Three
Example invalid select feedback
Example invalid form file feedback
Submit form