前言¶
做 UI 或前端時，顏色往往要在 HEX、RGB、HSL 之間來回換算；做無障礙時還要查 WCAG 對比度是否達標；定主題色之後，還要試幾組搭配並快速預覽。這些步驟分散在在線工具、設計軟件和手寫腳本里，和編碼上下文脫節。
下面介紹 SkillHub 上的 color-toolkit-turn（座標 @user_800d68d6/color-toolkit-turn，當前版本 3.4.0）。它把顏色編碼轉換、對比度計算、智能顏色推薦和 HTML 預覽生成收進一套 Agent Skill，在對話裏完成上述工作。標籤標明 requires_api_key=false，安裝後無需額外 API Key。
這是什麼¶
color-toolkit-turn 是社區來源（community）的 design-media 類 Skill，由發佈者 user_800d68d6 維護。官方簡介將其定位爲專業顏色工具集，面向 UI 設計、無障礙開發與配色方案生成等場景。
與「自己搜換算公式 + 打開對比度計算器」相比，Skill 的價值在於：能力寫在 SKILL.md 規範裏，由 Cursor、Claude Code、Codex 等支持 Skills 的客戶端加載後，Agent 按同一套說明執行顏色相關任務。
核心功能¶
以下能力均來自 SkillHub 頁面與抓取元數據，未單獨展開實現細節：
- 顏色編碼轉換：在不同顏色表示形式之間轉換（具體支持格式以 Skill 內說明爲準）。
- 對比度計算：用於無障礙與可讀性檢查場景。
- 智能顏色推薦：在配色、主題延展時給出顏色建議。
- HTML 預覽生成：把配色或樣式以 HTML 形式輸出，便於快速查看效果。
安裝與啓用¶
SkillHub 建議通過其安裝文檔完成 CLI 與技能安裝；頁面給出的安裝提示如下。
1、安裝 SkillHub CLI（若尚未安裝）¶
先檢查是否已有 skillhub：
command -v skillhub && skillhub --version
未安裝時，可按官方文檔執行完整安裝（CLI + 默認 Skill）：
curl -fsSL https://skillhub-1388575217.cos.ap-guangzhou.myqcloud.com/install/install.sh | bash
僅需要 CLI 時：
curl -fsSL https://skillhub-1388575217.cos.ap-guangzhou.myqcloud.com/install/install.sh | bash -s -- --cli-only
說明與權限、沙箱聯網等注意點見 SkillHub 安裝與優先源配置。
2、安裝 color-toolkit-turn¶
安裝技能時必須用 --dir 指向當前 Agent 的 skills 目錄，否則默認裝到 ./skills/ 可能不會被客戶端識別。
skillhub install @user_800d68d6/color-toolkit-turn --dir <skills 目錄>
常用客戶端的 skills 目錄（摘自官方安裝文檔）：
- Cursor：
~/.cursor/skills/ - Claude Code：
~/.claude/skills/ - Codex：
~/.codex/skills/或項目下的.agents/skills/
也可將下面提示發給 AI，讓其按安裝文檔代爲安裝：
請根據 https://skillhub.cn/install/skillhub.md，安裝 `@user_800d68d6/color-toolkit-turn`。
安裝完成後，按所用客戶端要求刷新或重啓，使 Skill 被加載。
典型用法¶
公開頁面未附帶逐條 CLI 示例子命令；可復現的入口是：先完成安裝，再在對話中說明需求，讓 Agent 調用已加載的 color-toolkit-turn。需求類型與官方能力對應即可，例如：
- 給出一種顏色編碼，要求轉換爲其他編碼格式。
- 指定前景色與背景色，要求計算對比度並說明是否滿足無障礙檢查需要。
- 基於主色或風格描述，要求推薦一組協調色。
- 要求生成帶指定配色的 HTML 預覽片段。
具體參數格式、輸出結構以安裝包內 SKILL.md 爲準；本文未抓取到該文件全文，不展開未覈實的調用細節。
適用場景與注意¶
適合誰
- 前端與 UI 開發：在寫樣式、主題變量時減少上下文切換。
- 無障礙相關開發：需要對比度結論時直接在 Agent 側完成。
- 需要快速配色預覽、又不想反覆粘貼到外部工具的設計協作場景。
注意
- 版本以 SkillHub 爲準（當前 3.4.0）；升級可用
skillhub按文檔更新到對應目錄。 - 無需 API Key，但仍依賴本地 Agent 是否正確加載 skills 目錄。
- 智能推薦與 HTML 預覽的質量取決於模型與 Skill 內規則，複雜品牌色規範仍需人工複覈。
SkillHub 統計（抓取時）：評分 100000，下載 858；分類 design-media。
結尾¶
color-toolkit-turn 把顏色換算、對比度、推薦與 HTML 預覽集中到一條 Skill 鏈路裏，適合在支持 Skills 的編碼環境中處理配色與無障礙檢查。安裝與座標以 SkillHub 爲準。
- SkillHub 頁面：https://www.skillhub.cn/skills/user_800d68d6/color-toolkit-turn
- 資源地址：https://api.skillhub.cn/user_800d68d6/color-toolkit-turn
