building-formslisted

# Form Systems & Input Patterns Build accessible, user-friendly forms with systematic component selection, validation strategies, and UX best practices. ## Purpose Forms are the primary mechanism for user data input in web applications. This skill provides systematic guidance for: - Selecting appropriate input types based on data requirements - Implementing validation strategies that enhance user experience - Ensuring WCAG 2.1 AA accessibility compliance - Creating complex patterns (multi-step wizards, conditional fields, dynamic forms) ## When to Use This Skill **Triggers:** - Building contact forms, login/registration flows, checkout processes - Implementing surveys, questionnaires, or settings pages - Adding validation to user inputs - Creating multi-step workflows or wizards - Ensuring form accessibility - Collecting structured data (addresses, credit cards, dates) **Common Requests:** - "Create a registration form with validation" - "Build a multi-step checkout flow" - "Add inline validation to email input" - "Make this form accessible for screen readers" - "Implement a survey with conditional questions" ## Universal Form Concepts ### Component Selection Framework **The Golden Rule:** Data Type → Input Component → Validation Pattern Start by identifying the data type to collect, then select the appropriate component: **Quick Reference:** - **Short text** (<100 chars) → Text input, Email input, Password input - **Long text** (>100 chars) → Textarea, Rich text e