Are the generated components accessible?

Absolutely. It leverages Radix UI primitives to ensure that all generated UI components meet high web accessibility standards.

Is it compatible with existing shadcn/ui setups?

Yes, this skill is specifically designed to follow the shadcn/ui component pattern and file organization structure.

Can I generate domain-specific feature components?

Yes, the skill understands the IntelliFill architecture and can place components in the correct domain-specific or layout directories.

What styling framework does this skill use?

It utilizes TailwindCSS combined with class-variance-authority (CVA) to manage complex component variants and utility-first styling.

Does it support form validation?

Yes, the skill generates robust forms using React Hook Form integrated with Zod for comprehensive schema-based validation.

Frontend Component Architect

Name: Frontend Component Architect
Author: Intellifill

byIntellifill

•

デザインツール

Generates production-grade React components using TailwindCSS, CVA, and Radix UI for the IntelliFill platform.

This skill streamlines the development of React components within the IntelliFill frontend by enforcing strict architectural patterns. It automates the creation of base UI elements, complex forms, and page-level layouts using a tech stack consisting of TailwindCSS for styling, Radix UI for accessibility, and class-variance-authority (CVA) for sophisticated variant management. By following the shadcn/ui pattern and integrating React Hook Form with Zod validation, it ensures that every generated component is accessible, maintainable, and visually consistent with the IntelliFill ecosystem.

主な機能

01Advanced variant management with class-variance-authority (CVA)

02Automated form generation with React Hook Form and Zod validation

031 GitHub stars

04Strict architectural compliance with the IntelliFill directory structure

05Standardized UI component scaffolding based on shadcn/ui patterns

06Accessible UI primitive integration via Radix UI

ユースケース

01Building complex document processing forms with field-level schema validation

02Creating reusable UI primitives like custom buttons, inputs, and accessible dialogs

03Developing consistent page layouts and feature-specific domain components

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add intellifill/intellifill frontend-component

For use in Claude.ai and ChatGPT

Download Skill