Forms CSS

This is a demonstration of the CSS used to style forms.

Forms

Buttons

Outline Buttons

Disabled Buttons


Button Sizes

Large

Small

Block Button

Multi Option Set

Disabled Multi Option Set

Multi Option Set Sizes

Large

Small

Radio Buttons

Checkboxes

Fieldsets and legends

Use <fieldset> elements to group related form fields together. Give each <fieldset> a <legend> to use as a title.

About you
Security

Full form example

Login details

We'll never share your email with anyone else.

Your choices

Any other information?

This is some placeholder block-level help text for the above input. It's a bit lighter and easily wraps to a new line.

Hidden Labels

Input Sizes

Defining States

Input States

Success! You've done it.
Example help text that remains unchanged.
Shucks, check the formatting of that and try again.
Example help text that remains unchanged.
Sorry, that username's taken. Try another?
Example help text that remains unchanged.

Checkbox States

File Upload