When to use it.
Use visible labels, helpful validation, and enough spacing for touch and keyboard users.
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
0/4Implementation checklist.
Handoff notes
Implementation notes for this component.
Quick section export
<form class="ap-profile-form"><div class="ap-avatar">FE</div><label class="ap-field"><span>Name</span><input value="Frank Edens"></label><label class="ap-field"><span>Email</span><input value="frank@example.com"></label><label class="ap-field"><span>Role</span><input value="Administrator"></label><button>Save profile</button></form>Related components