Form Empty State

Form empty states are used to indicate that no data is available to display for a given form field.
Developer Guidelines


Empty State

A form value in read mode should never be void of text. If a user has opted out of completing a form field the double dashes will appear to clearly indicate that there should not be content displayed for that element.


When a user fills out a form and leaves any input or select blank (that are not otherwise required) the empty input or select will display itself as -- [two dashes] once the form is in read mode.

Each form element will have the same read view empty state. Unless specified differently for the given component.
If a single checkbox is needed (but not recommended), the empty state will be text that reads ‘No’ in place of the --. See the checkbox component page for more info.



The typography and color used for the label will align with the specific component used in edit mode.


Padding between the label and -- in the read view should default to the defined form padding, agnostic of the field's input type. This rule includes components like checkbox/radio list that have more padding between the label and the list on read.