Field
Capture user text input.
Installation
pnpm add @base-ui/reactExamples
Free, accessible React field components built with Base UI for text fields, search boxes, and form validation with focus states.
Base
Icon
Add a search icon on the left side of the input.
Icon Right
Add a search icon on the right side of the input.
Error
Display validation error when the field is empty and required.
Please add a description to your task
Success
Show a helper message below the input for guidance.
Workspace name is available
Helper
Add descriptive text below the input for additional context.
Format: TSK followed by 6 digits
Disabled
Prevent user interaction using the disabled prop.
Password
Toggle password visibility with a show/hide button.
Must be at least 8 characters
Prefix
Add a prefix before the input with a visual separator.
Suffix
Add a suffix after the input with a visual separator.
Number Field
Increment and decrement numeric values with stepper controls.
Size Examples
Different sizes for all existing field variants.
Small
A small field size.
Medium
A medium field size.
Large
A large field size.