🎨

shadcn

skills.sh 생태계의 재사용 가능한 Agent Skill입니다. shadcn from shadcn/ui: Complete shadcn/ui component management for adding, searching, fixing, styling, and composing UI.

중급 20-45 minutes 0 조회수 0 좋아요
skills.shagent skillshadcndesignshadcn Reactshadcn

학습 시작

shadcn: 이 Skill이 하는 일

shadcn is a reusable agent skill listed on skills.sh under shadcn/ui. skills.sh rank #40, installs 147.4K, GitHub stars 114.9K, first seen Mar 6, 2026.

Complete shadcn/ui component management for adding, searching, fixing, styling, and composing UI. Manages the full component lifecycle: search registries, add components, view docs, preview changes with --dry-run and --diff , and intelligently merge upstream updates while preserving local modifications Enforces critical rules across forms (FieldGroup, Field, InputGroup, validation states), composition (Groups, overlays, Card structure), styling (semantic colors, gap spacing, size shorthand), and icons (data-icon attributes) Supports multiple registries (@shadcn, @magicui, @tailark, community presets) and provides component selection guidance via a reference table covering buttons, forms, overlays, navigation, charts, and layouts Injects project context automatically including aliases, framework, base library (radix vs base), icon library, Tailwind version, and resolved paths to ensure co

사용하기 좋은 상황

  • Use this skill when the task matches the package name, repository context, or skills.sh topic: shadcn React.
  • Prefer it when a repeatable workflow is better than a one-off prompt: setup, review, design, deployment, automation, research, media generation, or operational checks.
  • For production work, read the linked repository and install command before allowing the agent to run scripts or modify files.

Agent 사용 방식

  1. Confirm the user intent and whether this skill is the right fit.
  2. Install or inspect the skill with the official command from skills.sh.
  3. Read the local SKILL.md and only load extra files referenced by that skill.
  4. Follow the skill's workflow, then verify the result with tests, screenshots, audits, or source-backed checks as appropriate.
  5. Record any constraints, missing credentials, tool permissions, or security warnings before handoff.

품질 및 안전 점검

  • Check repository ownership and source reputation: shadcn/ui.
  • Review security audit signals before installing; skills.sh reports: Gen Agent Trust Hub Pass Socket Pass Snyk Warn.
  • Never grant broad shell, browser, cloud, or deployment permissions without user approval.
  • Treat generated output as draft until validated by the skill's own acceptance criteria.
  • If the skill touches cloud resources, costs, credentials, customer data, or production deploys, require a human review step.

출처와 설치

  • skills.sh page: https://www.skills.sh/shadcn/ui/shadcn
  • Repository: https://github.com/shadcn/ui
  • Install command: npx skills add https://github.com/shadcn/ui --skill shadcn

FAQ

Is shadcn an agent, a prompt, or a skill?
It is a skill: a reusable package of task-specific instructions and supporting files that an agent can load when the user's request matches the workflow.

Should I install it automatically?
Only after checking the repository, install command, audit status, and whether the user wants this capability in the current agent environment.

What makes it useful for AIDreamHub users?
It helps users discover practical agent capabilities from the open skills ecosystem and compare them by task, source, install count, and operational risk.

Install & Source

Install Command
npx skills add https://github.com/shadcn/ui --skill shadcn
Official Repository Download ZIP

리소스

관련 스킬

🎨

frontend-design

Intermediate 20-45 minutes

skills.sh 생태계의 재사용 가능한 Agent Skill입니다. frontend-design from anthropics/skills: Distinctive, production-grade frontend interfaces that reject generic AI aesthetics.

skills.shagent skillanthropics
10
Learn
🎨

web-design-guidelines

Intermediate 20-45 minutes

skills.sh 생태계의 재사용 가능한 Agent Skill입니다. web-design-guidelines from vercel-labs/agent-skills: Audit UI code against Vercel's Web Interface Guidelines for design and accessibility compliance.

skills.shagent skillvercel-labs
10
Learn
🎨

ui-ux-pro-max

Intermediate 20-45 minutes

skills.sh 생태계의 재사용 가능한 Agent Skill입니다. ui-ux-pro-max from nextlevelbuilder/ui-ux-pro-max-skill: Comprehensive design intelligence for web and mobile UI/UX across 10 technology stacks.

skills.shagent skillnextlevelbuilder
10
Learn
🎨

openclaw-secure-linux-cloud

Intermediate 20-45 minutes

skills.sh 생태계의 재사용 가능한 Agent Skill입니다. openclaw-secure-linux-cloud from xixu-me/skills: openclaw-secure-linux-cloud packages reusable procedural knowledge for agents.

skills.shagent skillxixu-me
10
Learn