🎯

shadcn-ui

🎯Skill

from giuseppe-trisciuoglio/developer-kit

What it does

Rapidly build and customize modern, accessible React interfaces using pre-configured Tailwind CSS components from shadcn/ui library

Overview

A comprehensive shadcn/ui skill providing installation, configuration, and implementation patterns for building accessible React components. Covers buttons, dialogs, forms with React Hook Form and Zod, tables, and more — all styled with Tailwind CSS.

Key Features

Complete shadcn/ui component installation and setup guide
Form building with React Hook Form and Zod validation
Accessible UI patterns using Radix UI primitives
Theme customization and dark mode support with Tailwind CSS
Next.js integration patterns for App Router

Who is this for?

React developers building UIs with shadcn/ui who want Claude to correctly install, configure, and implement components following the library's patterns. Especially useful for forms, dialogs, and complex layouts.

📦

Same repository

giuseppe-trisciuoglio/developer-kit(107 items)

shadcn-ui

Installation

Vibe Index InstallInstalls to .claude/skills/ - auto-recognized by Claude Code

npx vibeindex add giuseppe-trisciuoglio/developer-kit --skill shadcn-ui

skills.sh Install⚠ Installs to .agents/skills/ - may not be auto-recognized by Claude Code

npx skills add giuseppe-trisciuoglio/developer-kit --skill shadcn-ui

Manual InstallCopy SKILL.md content and save to the path below

~/.claude/skills/shadcn-ui/SKILL.md

SKILL.md

9,577Installs

AddedJan 31, 2026

View on GitHub Back to Skills

More from this repository10

🎯

tailwind-css-patterns🎯Skill

Generates reusable Tailwind CSS design patterns and utility classes to accelerate responsive web development and maintain consistent styling.

🎯

unit-test-bean-validation🎯Skill

A comprehensive developer toolkit providing Claude Code skills and plugins for software development workflows, code quality, and productivity.

🎯

react-patterns🎯Skill

Provides reusable React component design patterns, state management techniques, and performance optimization strategies for scalable applications.

🎯

typescript-docs🎯Skill

TypeScript documentation skill for creating comprehensive API docs with JSDoc, TypeDoc, architectural decision records, and framework-specific patterns for NestJS, Express, React, Angular, and Vue

🎯

nestjs🎯Skill

A comprehensive developer toolkit providing Claude Code skills and plugins for software development workflows, code quality, and productivity.

🎯

spring-boot-test-patterns🎯Skill

Generates comprehensive test patterns and strategies for Spring Boot applications, focusing on unit, integration, and end-to-end testing methodologies.

🎯

spring-boot-rest-api-standards🎯Skill

A comprehensive developer toolkit providing Claude Code skills and plugins for software development workflows, code quality, and productivity.

🎯

spring-boot-security-jwt🎯Skill

Generates secure JWT authentication and authorization configurations for Spring Boot applications, implementing token-based security with role-based access control.

🎯

spring-data-jpa🎯Skill

A comprehensive developer toolkit providing Claude Code skills and plugins for software development workflows, code quality, and productivity.

🎯

unit-test-boundary-conditions🎯Skill

Generates comprehensive unit tests that systematically explore edge cases, boundary values, and extreme input scenarios for code robustness.