作者 dominikmartn · dominikmartn/hue
為品牌提供色調（URL、名稱或螢幕截圖）→ 獲得完整的設計語言：標記、排版、間距、明/暗、英雄配方、圖標套件和生成的設計系統技能。
dominikmartn/hue 是 Claude 的開源技能，可將任何品牌參考轉化為完整的設計系統。 將其指向cursor.com或Raycast，貼上螢幕截圖，或命名一種心情——它會分析並輸出顏色+排版+間距標記、一個小型組件庫、明暗變體、英雄配方和匹配的圖標套件。 設計語言套件包括 YAML 模型檔案和範例 HTML 登陸頁面；它還會產生每個品牌的克勞德技能，您可以在會話中重複使用，以便您的代理商自動保持品牌不變。
何時使用： 您喜歡網站的美感並希望有一個朝著相同方向發展的入門系統。
結果： 您的代理商將可重複使用的品牌聲音應用於每個後續的 UI 任務。
何時使用： 您有一個喜歡的 Dribbble 鏡頭，並希望它在您的應用程式中具有外觀。
結果： 來自單一參考的乾淨、可擁有的系統。
何時使用： 您有 5 位客戶，需要 5 個品牌主題，而無需進行克隆工作。
結果： 您可以透過技能啟動來交換白標主題。
將Figma 框架轉換為程式碼時使用hue 的標記
驗證產生的品牌是否通過對比 + a11y 規則
| 工具 | 輸入參數 | 何時呼叫 | 成本 |
|---|---|---|---|
| hue:generate (SKILL) | URL | brand name | screenshot + optional notes | 新產品啟動或加入客戶品牌時 | 0 |
生成的調色板看起來很混亂偏向 SVG/PNG 參考； JPEG 失去飽和度。 或提供技能應該尊重的六角錨。
Inspect generated tokens.json for the flagged colors深色模式下對比失敗要求色調以第一暗模式重新生成；超越中性。
Run claude-design-auditor on the dark variants| 替代方案 | 何時用它替代 | 權衡 |
|---|---|---|
| claude-code-design-skills | 您有一個要轉換的框架；你已經有一個品牌了 | 不產生品牌－消耗品牌 |
| magic-ui-mcp | 您需要現成的組件，而不是品牌系統 | 圖書館，而不是語言 |
| claude-design-auditor-skill | 您想要評估現有設計，而不是生產設計 | 評估，不生成 |