1. Home
  2. Design System
  3. Components
  4. Form Field

Form Field

A form field collects a specific piece of information within a form.

Where it goes: Inside a form

Additional instructions

Use sentence case for labels and error messages.

Accessibility notes

  • Include the <label> element for each form field, along with for /id to associate each label with the corresponding form field.
  • Use <fieldset> and <legend> to group associated form fields where appropriate.


Examples of various form fields, including form field label, form field with focus, text input error, text input success, form field text area, dropdown label, checkboxes, and radio buttons.
Date Last Reviewed: