skills CLI一行命令解析UI Skills如何把SKILL.md装进任意Agent【免费下载链接】ui-skillsSkills for Design Engineers项目地址: https://gitcode.com/GitHub_Trending/ui/ui-skillsUI Skills 是一个面向设计工程师Design Engineer的开源技能库它把经过实战沉淀的 UI 经验写成一个个 SKILL.md 技能文件再通过 skills CLI 一行npx命令就能把指定技能装进 Claude Code、Cursor、Codex 等任意支持 Agent Skills 的编程 Agent 中。为什么需要 UI SkillsAI 生成的界面往往能跑但不好看间距混乱、层级不清、动画卡顿、AI 味十足。UI Skills 的思路是把资深设计工程师的判断标准——间距、层级、排版、动效、无障碍——固化为 SKILL.md 文件让 Agent 在动手写 UI 代码前先读题按清单执行。整个仓库的技能注册表位于 src/data/registry.ts目前已收录 70 技能覆盖 motion、accessibility、typography、threejs 等 20 话题既有仓库自带的技能如 skills/baseline-ui/SKILL.md也聚合了社区仓库中的高质量 UI 技能。skills CLI 的 4 个核心命令所有命令都通过npx直接运行无需预先安装命令作用npx ui-skills start入口命令让 Agent 按路由协议自动挑选最小可用技能集npx ui-skills categories列出全部技能分类npx ui-skills list --category motion按分类查看技能清单npx ui-skills get baseline-ui直接拉取某个技能的 SKILL.md 内容这 4 条命令在源码中集中定义于 src/lib/ui-skills-cli.ts官方页面也用同一份数据渲染Agent, start here引导卡片见 src/ui/agent-start-here.astro保证人机看到的是同一套入口。推荐用法让 Agent 自动路由最省心的方式是先执行npx ui-skills start。它会展示仓库内置的路由技能 skills/ui-skills-root/SKILL.md其中定义了一套 7 步协议判断是否 UI 任务 → 定位分类 → 用 CLI 查看该分类 → 选出最小技能集 → 只加载选中的技能 → 开始实现。配套的选择规则很克制默认只用 1 个技能任务有两个明确角度才用 2 个最多不超过 3 个避免上下文过载。SKILL.md 是如何被装进 Agent 的关键在另一条命令skills add。每个技能的安装命令由 src/lib/ui-skills-cli.ts 统一生成格式固定为npx skills add 仓库地址 --skill 技能名skills CLI 会抓取目标仓库中的 SKILL.md 文件并写入当前项目之后 Claude Code、Cursor、Codex 等 Agent 在会话中会自动引用这些技能无需每次手动粘贴提示词。以仓库自带的 skills/baseline-ui/SKILL.md 为例它用 MUST / NEVER 清单约束动效时长交互反馈不超过 200ms、禁用紫色渐变、要求aria-label等专门用于给AI 味界面做一次快速抛光。支持哪些 Agentsrc/data/agents.ts 中登记了 20 个 Agent几乎覆盖主流阵营️终端类Claude Code、Codex、Gemini CLI、Kiro CLI、OpenCode编辑器 / IDE 类Cursor、Windsurf、VS Code、Zed、Roo、Kilo、Trae其他GitHub Copilot、Cline、AMP、Antigravity、Droid、Goose、Nous Research安装位置统一跟随当前项目仓库技能随项目走换机器克隆后依然可用。上手三步把技能装进你的 Agent第一步克隆仓库git clone https://gitcode.com/GitHub_Trending/ui/ui-skills第二步探索技能分类npx ui-skills categories npx ui-skills list --category motion第三步路由 安装npx ui-skills start npx skills add 仓库地址 --skill baseline-ui装好后直接让 Agent 按 baseline-ui 检查某个文件它会按 SKILL.md 清单输出违规项、原因和具体修复建议。小结 UI Skills 的核心设计非常简洁技能即 Markdown安装即一行命令。npx ui-skills负责路由与检索npx skills add负责安装两者配合把设计判断力变成任何 Agent 都能加载的上下文。 想深入了解技能内容的远程拉取与缓存机制5 秒超时、1MB 上限、离线降级可以看 src/lib/remote-skill.ts。【免费下载链接】ui-skillsSkills for Design Engineers项目地址: https://gitcode.com/GitHub_Trending/ui/ui-skills创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 skills CLI一行命令解析：UI Skills如何把SKILL.md装进任意Agent
skills CLI一行命令解析UI Skills如何把SKILL.md装进任意Agent【免费下载链接】ui-skillsSkills for Design Engineers项目地址: https://gitcode.com/GitHub_Trending/ui/ui-skillsUI Skills 是一个面向设计工程师Design Engineer的开源技能库它把经过实战沉淀的 UI 经验写成一个个 SKILL.md 技能文件再通过 skills CLI 一行npx命令就能把指定技能装进 Claude Code、Cursor、Codex 等任意支持 Agent Skills 的编程 Agent 中。为什么需要 UI SkillsAI 生成的界面往往能跑但不好看间距混乱、层级不清、动画卡顿、AI 味十足。UI Skills 的思路是把资深设计工程师的判断标准——间距、层级、排版、动效、无障碍——固化为 SKILL.md 文件让 Agent 在动手写 UI 代码前先读题按清单执行。整个仓库的技能注册表位于 src/data/registry.ts目前已收录 70 技能覆盖 motion、accessibility、typography、threejs 等 20 话题既有仓库自带的技能如 skills/baseline-ui/SKILL.md也聚合了社区仓库中的高质量 UI 技能。skills CLI 的 4 个核心命令所有命令都通过npx直接运行无需预先安装命令作用npx ui-skills start入口命令让 Agent 按路由协议自动挑选最小可用技能集npx ui-skills categories列出全部技能分类npx ui-skills list --category motion按分类查看技能清单npx ui-skills get baseline-ui直接拉取某个技能的 SKILL.md 内容这 4 条命令在源码中集中定义于 src/lib/ui-skills-cli.ts官方页面也用同一份数据渲染Agent, start here引导卡片见 src/ui/agent-start-here.astro保证人机看到的是同一套入口。推荐用法让 Agent 自动路由最省心的方式是先执行npx ui-skills start。它会展示仓库内置的路由技能 skills/ui-skills-root/SKILL.md其中定义了一套 7 步协议判断是否 UI 任务 → 定位分类 → 用 CLI 查看该分类 → 选出最小技能集 → 只加载选中的技能 → 开始实现。配套的选择规则很克制默认只用 1 个技能任务有两个明确角度才用 2 个最多不超过 3 个避免上下文过载。SKILL.md 是如何被装进 Agent 的关键在另一条命令skills add。每个技能的安装命令由 src/lib/ui-skills-cli.ts 统一生成格式固定为npx skills add 仓库地址 --skill 技能名skills CLI 会抓取目标仓库中的 SKILL.md 文件并写入当前项目之后 Claude Code、Cursor、Codex 等 Agent 在会话中会自动引用这些技能无需每次手动粘贴提示词。以仓库自带的 skills/baseline-ui/SKILL.md 为例它用 MUST / NEVER 清单约束动效时长交互反馈不超过 200ms、禁用紫色渐变、要求aria-label等专门用于给AI 味界面做一次快速抛光。支持哪些 Agentsrc/data/agents.ts 中登记了 20 个 Agent几乎覆盖主流阵营️终端类Claude Code、Codex、Gemini CLI、Kiro CLI、OpenCode编辑器 / IDE 类Cursor、Windsurf、VS Code、Zed、Roo、Kilo、Trae其他GitHub Copilot、Cline、AMP、Antigravity、Droid、Goose、Nous Research安装位置统一跟随当前项目仓库技能随项目走换机器克隆后依然可用。上手三步把技能装进你的 Agent第一步克隆仓库git clone https://gitcode.com/GitHub_Trending/ui/ui-skills第二步探索技能分类npx ui-skills categories npx ui-skills list --category motion第三步路由 安装npx ui-skills start npx skills add 仓库地址 --skill baseline-ui装好后直接让 Agent 按 baseline-ui 检查某个文件它会按 SKILL.md 清单输出违规项、原因和具体修复建议。小结 UI Skills 的核心设计非常简洁技能即 Markdown安装即一行命令。npx ui-skills负责路由与检索npx skills add负责安装两者配合把设计判断力变成任何 Agent 都能加载的上下文。 想深入了解技能内容的远程拉取与缓存机制5 秒超时、1MB 上限、离线降级可以看 src/lib/remote-skill.ts。【免费下载链接】ui-skillsSkills for Design Engineers项目地址: https://gitcode.com/GitHub_Trending/ui/ui-skills创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考