INPUTS / COMPONENTS
Assistive text
Put useful guidance beside the decision.
About assistive text
Connect instructions and errors with aria-describedby. Give a clear correction and avoid exposing an error before input is evaluated.
01
Anatomy
Shared parts, named consistently.
A stable namespace for your design tokens.
- 1Message
Explains context, validation, or the next step. Associate it with its control.
- 2Field association
Content or structure that supports the component’s purpose and reading order.
- 3Error state
Explains context, validation, or the next step. Associate it with its control.
Try the default
A working example with the shared V1 visual language.
A stable namespace for your design tokens.
When to use
Connect instructions and errors with aria-describedby. Give a clear correction and avoid exposing an error before input is evaluated.
Read with the field when referenced by aria-describedby. Error changes can be announced by the form.