Input controls and validation—text fields, dropdowns, date pickers, file uploads. 15 patterns for user-friendly data collection.
Form patterns minimize user effort while maximizing data accuracy. These 15 patterns cover text inputs, select dropdowns, checkboxes, radio buttons, date pickers, file uploads, autosave, inline validation, multi-step forms, and smart defaults. Good forms feel conversational, validate progressively, provide clear error messages, and save user progress. Mobile forms require larger touch targets and appropriate input types.
Input fields let users enter text data. Learn best practices for labels, placeholders, validation, and accessibility.
Form validation checks user input for errors. Learn when to validate, how to show errors, and accessibility best practices.
Autocomplete suggests options as users type. Learn when to use it, how to implement it, and common pitfalls to avoid.
File upload lets users select files from their device. Learn best practices for drag-drop, progress, validation, and error handling.
Checkboxes let users select multiple options. Learn when to use them vs. radio buttons and best practices for accessibility.
Radio groups let users select exactly one option from a list. Learn when to use them and best practices for design.
Toggle switches represent binary on/off states with immediate effect. Learn when to use them vs. checkboxes.
Date pickers let users select dates via calendar interface. Learn best practices for single dates, ranges, and mobile.
Search bars let users find content by typing queries. Learn best practices for autocomplete, filters, and search results.
Dropdowns let users pick one option from a collapsible list. Learn when to use them and alternatives for better UX.