Input

Inputs collect short freeform text and should stay visually aligned with surrounding controls.

Basic Usage

Use a placeholder for empty guidance and defaultValue when the control should open with an existing value.

Sizes

The input size scale matches adjacent buttons, selects, and other field controls so dense CP layouts still line up cleanly.

Widths

Inputs are full-width by default. Constrain the parent for field layouts, or add a width utility to the input when it needs a fixed width.

Validation

Use aria-invalid when the current value has failed validation so the field can surface its error state consistently.

Disabled

Disable the field when it is present for context but not currently editable.

Adornments

Use input groups when an icon, unit, or short prefix/suffix belongs inside the field boundary.

API reference

Input wraps Base UI Input. Use the Base UI API reference for native input behavior and accessibility details inherited by the component.