Form

A set of components for building forms with validation.

When To Use

Use the Form components when you need to:

Create structured and validated forms
Build forms with consistent styling and behavior
Implement client-side validation
Provide user-friendly error messages
Create accessible form controls
Manage form state efficiently

The Form components provide a comprehensive solution for building forms with validation while maintaining a consistent design.

Examples

Basic#

Login

Enter your email and password to access your account

Don't have an account? Sign up

Profile Form#

Profile

Update your profile information and manage your account settings.

Form Validation#

This form demonstrates various validation rules

Props

Prop	Type	Default

Prop	Type	Default
`$$typeof`	`symbol`	-
`displayName?`	`string`	-
`propTypes?`	`any`	-

Prop	Type	Default
`$$typeof`	`symbol`	-
`displayName?`	`string`	-
`propTypes?`	`any`	-

Prop	Type	Default
`$$typeof`	`symbol`	-
`displayName?`	`string`	-
`propTypes?`	`any`	-

Prop	Type	Default
`$$typeof`	`symbol`	-
`displayName?`	`string`	-
`propTypes?`	`any`	-

Prop	Type	Default
`$$typeof`	`symbol`	-
`displayName?`	`string`	-
`propTypes?`	`any`	-

Prop	Type	Default

Dropdown Menu

A vertically stacked menu that appears when triggered by a button.

Hover Card

A card that appears when hovering over a trigger element, providing additional information or context.