·shadcn-ui
*

shadcn-ui

Radix UI 또는 Base UI, Tailwind CSS 4 및 React 19와 함께 shadcn/ui를 사용하여 액세스 가능하고 사용자 정의 가능한 구성 요소 라이브러리를 구축합니다. 구성 요소 소유권, oklch CSS 테마, Field 및 Zod를 사용한 유형 안전 양식, CLI 워크플로 및 레지스트리 패턴을 다룹니다. shadcn/ui 구성 요소 추가, 테마 구성, Zod로 양식 작성, 사용자 정의 레지스트리 생성 또는 액세스 가능한 구성 요소 변형 구성 시 사용합니다. shadcn CLI, 다크 모드, 구성 요소 변형, 양식 유효성 검사에 사용합니다.

28설치·2트렌드·@oakoss

설치

$npx skills add https://github.com/oakoss/agent-skills --skill shadcn-ui

shadcn-ui 설치 방법

명령줄에서 shadcn-ui AI 스킬을 개발 환경에 빠르게 설치

  1. 터미널 열기: 터미널 또는 명령줄 도구(Terminal, iTerm, Windows Terminal 등)를 엽니다
  2. 설치 명령어 실행: 이 명령어를 복사하여 실행합니다: npx skills add https://github.com/oakoss/agent-skills --skill shadcn-ui
  3. 설치 확인: 설치 후 스킬은 자동으로 AI 코딩 환경에 설정되어 Claude Code, Cursor, OpenClaw에서 사용할 수 있습니다

출처: oakoss/agent-skills.

Guides building accessible, customizable UI with shadcn/ui as a code generation platform (not an npm dependency). Components are copied into your project via the CLI and fully owned. Supports Radix UI or Base UI primitives, Tailwind CSS 4 with oklch color tokens, React 19 direct ref patterns, and type-safe form validation with the Field component and Zod.

When to use: Adding shadcn/ui components, theming with CSS variables and oklch colors, building forms with React Hook Form or TanStack Form, creating custom registries, composing accessible component variants, setting up dark mode.

When NOT to use: Non-React frameworks (use shadcn-vue or shadcn-svelte instead), projects using a different component library (MUI, Chakra), projects not using Tailwind CSS.

Radix UI 또는 Base UI, Tailwind CSS 4 및 React 19와 함께 shadcn/ui를 사용하여 액세스 가능하고 사용자 정의 가능한 구성 요소 라이브러리를 구축합니다. 구성 요소 소유권, oklch CSS 테마, Field 및 Zod를 사용한 유형 안전 양식, CLI 워크플로 및 레지스트리 패턴을 다룹니다. shadcn/ui 구성 요소 추가, 테마 구성, Zod로 양식 작성, 사용자 정의 레지스트리 생성 또는 액세스 가능한 구성 요소 변형 구성 시 사용합니다. shadcn CLI, 다크 모드, 구성 요소 변형, 양식 유효성 검사에 사용합니다. 출처: oakoss/agent-skills.

인용 가능한 정보

AI/검색 인용용 안정적인 필드와 명령어.

설치 명령어
npx skills add https://github.com/oakoss/agent-skills --skill shadcn-ui
카테고리
*크리에이티브
인증됨
최초 등록
2026-02-22
업데이트
2026-03-10

Browse more skills from oakoss/agent-skills

빠른 답변

shadcn-ui이란?

Radix UI 또는 Base UI, Tailwind CSS 4 및 React 19와 함께 shadcn/ui를 사용하여 액세스 가능하고 사용자 정의 가능한 구성 요소 라이브러리를 구축합니다. 구성 요소 소유권, oklch CSS 테마, Field 및 Zod를 사용한 유형 안전 양식, CLI 워크플로 및 레지스트리 패턴을 다룹니다. shadcn/ui 구성 요소 추가, 테마 구성, Zod로 양식 작성, 사용자 정의 레지스트리 생성 또는 액세스 가능한 구성 요소 변형 구성 시 사용합니다. shadcn CLI, 다크 모드, 구성 요소 변형, 양식 유효성 검사에 사용합니다. 출처: oakoss/agent-skills.

shadcn-ui 설치 방법은?

터미널 또는 명령줄 도구(Terminal, iTerm, Windows Terminal 등)를 엽니다 이 명령어를 복사하여 실행합니다: npx skills add https://github.com/oakoss/agent-skills --skill shadcn-ui 설치 후 스킬은 자동으로 AI 코딩 환경에 설정되어 Claude Code, Cursor, OpenClaw에서 사용할 수 있습니다

소스 저장소는 어디인가요?

https://github.com/oakoss/agent-skills

상세

카테고리
*크리에이티브
출처
skills.sh
최초 등록
2026-02-22