Label component

The label tells users the purpose of a field.


Labels should be top-aligned, short and descriptive so users can quickly scan forms.

Sentence case should be used to write labels.

For required fields, red asterisks should be added next to labels.

For read only fields, lock icons should be added next to labels.


Since most form components have already labels build in, this component should be used in special circumstances only – e.g. when creating a new form component.