UI Kits
Forms

Text Input

Labeled text input with helper text.

Usage guidance

When to use it.

Use visible labels, helpful validation, and enough spacing for touch and keyboard users.

Accessibility

Implementation notes.

  • Associate every input with a visible label.
  • Expose validation errors in text.
  • Maintain logical keyboard order and sufficient touch target size.
Release QA

Implementation checklist.

0/4
Handoff notes

Implementation notes for this component.

Quick section export
<label class="ap-field"><span>Company name</span><input type="text" placeholder="AblePro, Inc."><small>Enter the legal or public-facing name.</small></label>
Related components

More in Forms