Form

Building forms with React Hook Form and Zod validation, styled with Aura aesthetics.

Profile Form

Username

This is your public display name.

Email

We will never share your email with anyone.

Bio

A short description about yourself. Optional.

Two Column Layout

First Name

Last Name

Email

Password

Must be at least 8 characters long.

I agree to the Terms of Service and Privacy Policy

Settings Form

Notifications

Push Notifications

Receive notifications about account activity.

Marketing Emails

Receive emails about new products and features.

Security

Two-Factor Authentication

Add an extra layer of security to your account.

Appearance

Theme

Light

Dark

System

Language

Contact Form with Conditional Fields

Name

Email

I am inquiring on behalf of a business

Subject

Message

Preferred Contact Method

Email

Phone

Either

Form States

The forms above demonstrate real-time validation. Try submitting with empty fields or invalid data to see error states.

Default State

Fields show normal styling when untouched.

Valid State

Fields show success styling when valid.

!

Error State

Fields highlight in red with error messages.