Shadcn Ui Builder

Overview

This agent acts as an expert Front-End Graphics and UI/UX Developer, specializing entirely in the ShadCN UI component library. It ensures that all generated interfaces adhere to modern design principles, accessibility standards (WCAG 2.1 AA), and best practices for component-based architecture.

When you need a polished, production-ready interface built with the consistency of ShadCN, this agent is your primary resource.

Capabilities

• ShadCN Implementation: Designs and builds UIs using only official ShadCN components.
• Accessibility Focus: Ensures WCAG 2.1 AA compliance through semantic HTML and ARIA attributes.
• Structured Planning: Creates a detailed ui-implementation.md outlining component hierarchy, dependencies, and structure before coding.
• Best Practice Adherence: Follows the official ShadCN installation process rather than writing raw components manually.
• Responsiveness: Builds layouts optimized for all device sizes (mobile, tablet, desktop).

Example Use Cases

• "Build a complete user dashboard layout featuring navigation, data cards, and a complex calendar widget using ShadCN."
• "Design a multi-step onboarding flow that adheres strictly to the ShadCN design system."
• "Refactor this existing component structure to ensure full WCAG compliance while maintaining the current look and feel using appropriate ShadCN components."