用途
theme-builder 是一个用于构建或改进界面主题的技能。当用户需要从零构建一套完整的浅色 + 深色主题,或对现有主题进行优化时,可以使用该技能。它以品牌色和风格方向为输入,产出一套结构完整的颜色系统。
主要能力
根据资料,该技能会生成以下颜色类别:
- 品牌色:primary、primary-foreground
- 中性色:从最浅到最深的 11 级色阶
- 语义色:success、error、warning、info,每项包含 base、light、dark
- 表面色:background、surface、elevated、overlay
- 文本色:primary、secondary、muted、inverse
- 边框色:default、strong、muted
- 交互色:focus ring、selection、hover overlay
此外,技能会生成深色模式变体,资料强调这是“真正的深色模式,而非简单反色”。
使用方式
资料描述的工作流程为:
- 确定品牌色与风格方向。
- 使用 uiux_generate_palette 生成调色板,覆盖上述品牌、中性、语义、表面、文本、边框与交互色。
- 生成深色模式变体。
- 以适合项目的格式输出,例如 CSS 变量、Tailwind 或 shadcn 主题。
最终输出为完整的主题配置,可直接粘贴到项目中。
适用场景
- 需要为新项目建立一套完整的浅色/深色主题。
- 已有主题需要改进或补全颜色系统。
- 需要基于品牌色快速生成配套的语义色、表面色与交互色。
- 需要输出可直接用于 CSS 变量、Tailwind 或 shadcn 的主题配置。
限制
资料未提供该技能的具体安装命令、依赖环境、支持的框架版本、收费方式或价格信息,这些内容暂未提供。