Sample Basic Forms

Form row


Your password must be 8-20 characters long, contain letters and numbers, and must not contain spaces, special characters, or emoji.

Note: height of the textarea depends on the rows attribute.
Note: expands on focus.

Appended icon(s)


Appended icon(s) with border

@

We'll never share your email with anyone else.
This is some placeholder block-level help text for the above input. It's a bit lighter and easily wraps to a new line.
Radio buttons
Input Group
@
@example.com
https://example.com/users/
$
.00
With textarea
Form Grid

Basic form elements

Basic form elements

Select menu

Custom <select> menus need only a custom class, .custom-select to trigger the custom styles.

Checkboxes and radios

Input Sizes

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

Input Group

Easily extend form controls by adding text, buttons, or button groups on either side of textual inputs, custom selects, and custom file inputs

@

Input Types

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.

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