Does this skill support mobile-responsive forms?

Yes, all patterns follow mobile-first UX principles, including large touch targets and appropriate input types for mobile keyboards.

Is accessibility built into the generated forms?

Yes, the skill prioritizes WCAG 2.1 AA compliance, implementing correct ARIA labels, keyboard navigation, and screen reader associations.

Does it handle complex multi-page workflows?

Yes, it provides decision trees and implementation patterns for linear wizards, branching logic, and save-and-resume functionality.

What frontend libraries are recommended?

While the concepts are universal, the skill provides specific implementations for React Hook Form, Radix UI, and React Aria.

Can I use this for backend data validation?

Absolutely. It includes patterns for Pydantic (Python) and Zod (TypeScript) to ensure data integrity across the entire stack.

Professional Form Systems

Name: Professional Form Systems
Author: ancoleman

byancoleman

•

158

デザインツール

Builds accessible, high-performance form components and data collection interfaces with integrated validation and UX best practices.

概要

This skill empowers Claude to design and implement sophisticated form systems ranging from simple contact fields to complex multi-step wizards. It provides a systematic framework for selecting from over 50 input types based on data requirements, ensuring WCAG 2.1 AA accessibility compliance by default. Whether you are working with React and Zod on the frontend or FastAPI and Pydantic on the backend, this skill offers standardized validation strategies, error handling patterns, and modern UX principles like progressive disclosure and smart defaults to streamline user data collection.

主な機能

50+ standardized input types and specialized UI components
158 GitHub stars
Complex workflow support for multi-step wizards and conditional logic
Native WCAG 2.1 AA accessibility compliance and ARIA integration
Comprehensive validation strategies including Blur, Change, and Debounced patterns
Cross-stack implementation guides for React, TypeScript, and Python

ユースケース

Creating multi-step checkout, registration, and onboarding flows
Implementing real-time, schema-based validation for complex data structures
Designing accessible surveys and data-heavy settings interfaces

概要

主な機能

50+ standardized input types and specialized UI components
158 GitHub stars
Complex workflow support for multi-step wizards and conditional logic
Native WCAG 2.1 AA accessibility compliance and ARIA integration
Comprehensive validation strategies including Blur, Change, and Debounced patterns
Cross-stack implementation guides for React, TypeScript, and Python

ユースケース

Creating multi-step checkout, registration, and onboarding flows
Implementing real-time, schema-based validation for complex data structures
Designing accessible surveys and data-heavy settings interfaces