Forms

Form elements

All text inputs must have visible labels; placeholder text is not an acceptable replacement for a label as it vanishes when users click on the text input.

Labels should be aligned above the text input they refer to. They should be:

• short and direct
• written in sentence case
• Don’t use colons

Text Input

Select Input

Textarea

Checkbox inputs

Allow a user to select one or more options.

Radio buttons

Allow a user to select only one option from a list of options. Ideal for short lists and usually preferable to select inputs as all the options are immediately visible.

Buttons

Buttons share styling from links but the underlying control is distinct. A button is an action that triggers code usually submit.