菜单
Use this skill when building dashboard UI with Tailwind v4 + shadcn/ui and you want consistent layouts, components, and patterns.
用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
基于 SOC 职业分类
Use this skill when you need to diagnose and fix React 19 performance issues (render churn, slow updates, Suspense/Transitions, memoization, profiling, and React Compiler).
Write clean, behavior-focused unit/integration tests that remain trustworthy when code is written or modified by agents (prevents “test weakening”, enforces invariants, and adds CI guardrails).
Use this skill when you are creating or updating Agent Skills in your project (structure, YAML frontmatter, naming, and progressive disclosure).
Use this skill when designing or refactoring boundaries, responsibilities, and change drivers using practical software architecture “hard parts” thinking + SRP.
Use this skill when you need a Bun runbook (dev, build, lint, typecheck, tests, migrations, and verification steps).
Use this skill when you need a thorough code hygiene pass (dead code, lint escapes, consistency, formatting drift, and subtle smells) on touched files.
| name | tailwind-ui-patterns |
| description | Use this skill when building dashboard UI with Tailwind v4 + shadcn/ui and you want consistent layouts, components, and patterns. |
Use this skill when building or updating UI components. Stack: Tailwind v4 + shadcn/ui (optional) + your app’s existing layout/shell patterns.
components/ui primitives (Button, Card, Input, Select, Dropdown, Badge, etc.).cn helper from @/lib/utils for conditional classes.useFormStatus in client components when needed.gap-4, p-4/6/8, text-sm/md.Label component.messages/*.json with useTranslations or getTranslations./{locale}/...).bun run lint after UI changes. Keep client components minimal.'use client' components leaf-ish; don’t mark whole pages/layouts as client just for a small interaction.Reference: nextjs-cost-performance skill.
components/ui/*