Form layouts
Common patterns for arranging controls and full-page form experiences.
Field arrangement
Common ways to arrange labels and controls.
Vertical form
Labels stacked above each control
Horizontal form
Labels beside controls, aligned in a column
Inline form
Compact fields on a single row
Two-column form
Related fields side by side
Floating labels
Labels float inside the field border
Complete layouts
Full-page patterns with clear hierarchy and actions.
Sectioned settings
Label and description on the left, control on the right
Public profile
Make your profile visible to everyone
Product updates
News about features and releases
Security alerts
Alerts about sign-ins and security
Language
The language used across the dashboard
Delete account
Permanently remove your account and all data
Billing
Payment method and plan
Order summary
Sticky action bar
Actions stay visible while the form scrolls
You have unsaved changes
Multi-step form
A guided three-step flow
Multi-step progress
A progress-bar variant of the wizard