菜单
Build or redesign UI (pages, components, design system). Use when: new screen, landing page, layout, Tailwind, shadcn, 'make it look good', redesign, hero section, dashboard UI. Not for: animating existing UI (→ routr-motion); a visual bug from broken logic (→ routr-debug).
默认使用会先检查来源的 Prompt；你也可以切换为直接命令，或下载本地副本。
决定是否安装前，请先阅读 SKILL.md，以及 SkillsMP 当前展示的配套文件。
用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
直接命令不会经过审查 Prompt；运行前请先检查来源。
npx skills add https://github.com/TeckTinkerere/ROUTR --skill routr-frontend命令会保持在同一行。复制前请横向滚动并检查完整内容。
想先保存到本地？可下载 SkillsMP 当前能够提供的文件。
正在显示 SKILL.md
基于 SOC 职业分类
| name | routr-frontend |
| description | Build or redesign UI (pages, components, design system). Use when: new screen, landing page, layout, Tailwind, shadcn, 'make it look good', redesign, hero section, dashboard UI. Not for: animating existing UI (→ routr-motion); a visual bug from broken logic (→ routr-debug). |
Goal: distinctive, accessible UI that fits the product — not generic AI slop.
routr-motionroutr-debugroutr-mobileroutr-marketingNo code before a written design plan that passes self-critique.
Install missing from routr-catalog/references/skill-registry.md.
| Order | Skill | Tier |
|---|---|---|
| 1 | frontend-design | required |
| 2 | web-design-guidelines | recommended |
| 3 | ui-ux-pro-max | recommended |
| 4 | vercel-react-best-practices | recommended |
| 5 | tailwind-design-system | optional |
| 6 | shadcn | optional — if project uses shadcn |
| 7 | symdex-code-search | recommended |
| 8 | lean-ctx | recommended |
| 9 | find-docs | optional |
If frontend-design missing → read routr-depth-frontend OR references/fallback.md.
Skip: caveman during design exploration.
globals.css (signatures first)Follow workflow.md:
routr-motionshadcn + tailwind-design-system for primitivesprefers-reduced-motionfind-docs before unfamiliar library APIsSee design brief template in workflow.md.
routr-motionroutr-debugroutr-ship