Bootstrap 5 Forms & Controls

A comprehensive demonstration of Bootstrap 5's form components and input controls.

Basic Form

Bootstrap's form controls expand on our Rebooted form styles with classes.

We'll never share your email with anyone else.

Horizontal Form

Create horizontal forms with the grid by adding the row class to form groups and using the col-* classes to specify the width of your labels and controls.

Radios

Form Controls

Text Input Types

Select and Textarea

Checkboxes and Radios

Default Checkboxes
Switch Checkboxes
Default Radios
Inline Radios

Form Validation

Bootstrap provides validation styles for error, warning, and success states on form controls.

Looks good!
Looks good!
@
Please choose a username.
Please provide a valid city.
Please select a valid state.
Please provide a valid zip.
You must agree before submitting.

Input Groups

Easily extend form controls by adding text, buttons, or button groups on either side of inputs.

https://example.com/users/
$ .00
@
With textarea

Floating Labels

Create beautifully simple form labels that float over your input fields.

Range & File Inputs

Range Inputs

File Input