AI设计类的Taste-Skill

一、前置条件

1. 电脑安装 Node.js（自带 npx 命令）下载：https://nodejs.org/安装完成后打开终端（Windows CMD/PowerShell、Mac 终端），输入校验：

bash

node -v
npx -v

二、一键安装命令（OpenClaw /skills 体系）

方式 1：安装全套所有技能

bash

npx skills add https://github.com/Leonxlnx/taste-skill

方式 2【推荐】只安装核心 UI 前端技能（design-taste-frontend v2 新版）

bash

npx skills add https://github.com/Leonxlnx/taste-skill --skill "design-taste-frontend"

方式 3：安装稳定 v1 旧版本（兼容性更好）

bash

npx skills add https://github.com/Leonxlnx/taste-skill --skill "design-taste-frontend-v1"

常用其他 UI 技能按需安装

bash

# 高端视觉设计规范
npx skills add https://github.com/Leonxlnx/taste-skill --skill "high-end-visual-design"
# 极简UI风格
npx skills add https://github.com/Leonxlnx/taste-skill --skill "minimalist-ui"
# 图转代码工作流
npx skills add https://github.com/Leonxlnx/taste-skill --skill "image-to-code"

三、如果你无法使用 npx skills（网络 / 工具不支持）→ 手动安装方案

1. 打开 Github 仓库，下载 ZIP：https://github.com/Leonxlnx/taste-skill
2. 解压，找到对应技能文件夹内的 SKILL.md
3. 两种使用途径：
   • ✅ Cursor / Claude Code：把 SKILL.md 完整内容粘贴到【Custom Instructions / 自定义指令】
   • ✅ OpenClaw：将整个文件夹放入 ~/.openclaw/skills/

四、安装完成怎么生效

1. 重启 Cursor / Claude Code
2. 写需求时正常描述 UI 需求，AI 会自动加载 Taste-Skill 审美约束
3. 测试示例 Prompt：

使用前端技术搭建 AI 对话 Web 界面，遵循 taste-skill 设计规范，高级简约科技风，暗色主题，不要烂大街渐变模板

五、常见报错解决

npx skills 命令不存在→ 确认安装 Node.js；npx 依赖 OpenClaw 工具链。如果你只用 Cursor，直接手动复制 SKILL.md 到自定义指令最简单，不用 npx

Github 访问超时使用镜像地址命令：

bash

npx skills add https://gitcode.com/gh_mirrors/ta/taste-skill --skill "design-taste-frontend"