Label

Use Label to provide a visible and programmatic name for form controls.

Example

API reference

LabelProps

requiredbooleanfalse

Name: required

Description: Appends required indicator to the label text.

Type: boolean

Default: false

htmlForstring

Name: htmlFor

Description: ID of associated form control element.

Type: string

Default:

childrenReactNode

Name: children

Description: Visible label text content.

Type: ReactNode

Default:

Accessibility

  • WCAG 1.3.1: Label and control association is explicit via htmlFor and id.
  • WCAG 2.5.3: Visible label text aligns with accessible name.
  • WCAG 3.3.2: Required indicator provides clear data entry expectations.

Playground

Open Form stories