Stylecc — Design skill for Claude Code

Agent Skills

技术栈无关的 Agent Skills（`SKILL.md` 开放标准，见 https://agentskills.io）集合，可在 **Claude Code / CodeBuddy / Codex CLI / Gemini CLI / Cursor** 等支持该标准的工具中复用。面向「用户以页面/功能名提出修改诉求」的模糊场景，强制走完整闭环后再改代码。

包含的 Skill

Skill	用途
stylecc	通用样式变更闭环（Style Change Closed-loop）：定位消歧 → 列出现状 → 修改前确认 → 前后对比 → 结构示意 → 模块标注 → 持久化。适用于任何技术栈（React / Vue / Flutter / SwiftUI / Compose / 小程序 / 原生 CSS）的颜色、字体、字号、间距、圆角、边框、阴影、渐变、动画、布局、尺寸、组件变体、主题 token 等视觉样式改动，以及新增展示字段、数据结构调整。

兼容性

`stylecc/SKILL.md` 遵循 Agent Skills 开放标准（SKILL.md + name/description 元数据），各工具读取格式一致，仅技能目录不同：

工具	用户级目录（所有项目）	项目级目录（单仓库）
Claude Code	~/.claude/skills/	.claude/skills/
CodeBuddy	~/.codebuddy/skills/	.codebuddy/skills/
Codex CLI	~/.codex/skills/	.codex/skills/
Gemini CLI	~/.gemini/skills/	—
Cursor	~/.cursor/skills/	.cursor/skills/

安装

方式一：一键同步到多工具（推荐）

`install.sh` 把本仓库 `stylecc/` 以**符号链接**挂到本机各工具的技能目录，实现单份维护、多处生效：

./install.sh                          # 预览：检测本机已安装哪些工具，不写入
./install.sh --apply                  # 应用到所有检测到的工具
./install.sh --apply --tools codebuddy,claude,gemini   # 只装指定工具
./install.sh --apply --mode copy      # 改为复制（不保留链接，适合随包分发）

各工具入口若与官方最新文档有出入，以官方为准；要增删支持目标，直接编辑 `install.sh` 顶部 `TOOLS` / `DIRS` 两个数组。

方式二：手动放置

把 `stylecc/` 目录放入上表任一工具目录即可生效，例如用户级：

cp -R stylecc ~/.codebuddy/skills/stylecc   # CodeBuddy
cp -R stylecc ~/.claude/skills/stylecc      # Claude Code

项目级（仅某仓库生效）：`cp -R stylecc <仓库>/.claude/skills/` 等。

方式三：zip 导入

打包产物在 [dist/](dist/)。重新生成：`python3 /scripts/package_skill.py stylecc ./dist`。可解压到任意技能目录，或按工具能力直接导入。

触发场景

用户以**页面/功能名**提出样式或展示诉求时自动触发，例如：

• 「我的这块调一下」「订单页看着别扭」「设置里那个开关改一下」
• 需求含糊的「把这页调一下」「改好看点」「看着别扭」
• 任何颜色 / 字体 / 字号 / 间距 / 圆角 / 边框 / 阴影 / 渐变 / 动画 / 布局 / 尺寸 / 组件变体 / 主题 token 修改，或新增展示字段、数据结构调整

stylecc 工作流（三段式）

① 定位      用户入口词（如"我的"）是指称而非坐标 → 先枚举候选，确认「哪