Form Error Message
Form error message renders the surrounding form control's validation error as design-system-styled error text. Form Field renders it automatically via its error prop, which is the normal path; use it directly only inside a form-control context that is currently invalid — outside one it renders nothing, silently.
#
The typical way to show an error is Form Field's error prop, which renders this component under the input:
Direct use is for custom field layouts built on Chakra's FormControl, where you place the error text yourself:
#
#
- When building a custom field layout on Chakra's form-control primitives that Form Field can't express, and the error text should match the design system.
#
- With Form Field — pass the
errorprop instead; adding your own would show the message twice. - Outside an invalid form-control context — the component returns
null, so the message silently never appears.