菜单
Install shadcn-svelte UI components via CLI. Use when adding a new shadcn-svelte component (e.g. switch, label, checkbox) or when the user asks to add a component from shadcn-svelte.
用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
基于 SOC 职业分类
Validates animation durations, enforces typography scale, checks component accessibility, and prevents layout anti-patterns in Tailwind CSS projects. Use when building UI components, reviewing CSS utilities, or enforcing design consistency.
Making changes to the app's functionality.
Create Criterion benchmarks with proper group macros and configuration. Use when writing benchmarks, creating benchmark groups, using criterion_group! and criterion_main! macros, setting throughput, or benchmarking multiple implementations. Handles benchmark groups, throughput metrics, conditional compilation, and proper black_box usage.
Read and parse GitHub issues; extract title, body, labels, checklists, and acceptance criteria to support triage and delegation.
Apply cognitive and perception-based UI principles from Laws of UX. Use when evaluating layout, interaction design, target size and distance, choice count, information grouping, memory load, or response time. Cites specific laws (e.g. Fitts's Law, Hick's Law) to justify design decisions or suggest improvements.
Work with async/await, futures, and asynchronous Rust code. Use when writing async functions, working with tokio or async-std, understanding futures, or implementing async traits. Handles async/await syntax, futures, executors, pinning, Send/Sync bounds, and async patterns.
| name | shadcn-svelte-add-component |
| description | Install shadcn-svelte UI components via CLI. Use when adding a new shadcn-svelte component (e.g. switch, label, checkbox) or when the user asks to add a component from shadcn-svelte. |
src/lib/components/ui/.Always install components using the CLI so files are generated in the project’s UI folder with the correct structure and styling.
bunx shadcn-svelte@latest add <component-name>
bunx (this project uses bun).switch, label, checkbox, dialog.src/lib/components/ui/<component-name>/.bunx shadcn-svelte@latest add switch
bunx shadcn-svelte@latest add label
bunx shadcn-svelte@latest add checkbox
import { Switch } from "$lib/components/ui/switch/index.js";Switch) from the component’s index.ts when using it in Svelte.npx or pnpm dlx unless the user has specified a different package manager for this project.