Single-line text entry with built-in validation, form association, and accessibility.
Basic text input with a label and placeholder.
Small (32px), medium (40px default), and large (48px) heights.
Focus state shows accent border and focus ring.
A filled input looks identical to resting - a value is not a state.
Readonly inputs use a secondary background and default cursor.
Disabled inputs are dimmed and not interactive.
Author-forced invalid state with error text.
Prefix and suffix slots for icons or inline content.
Clear button appears when the input has a value. Press Escape or click the button to clear.
Character counter shows n/maxlength when show-counter and maxlength are set.
Text input used inside a form with validation.
Text input under the dark theme (toggle via the toolbar).
Event output for the clearable input above.