SuperAPI AI 工具集

theme-builder

设计与创作

查看项目

更新于 10-15 09:50

技能介绍

用途

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

此外,技能会生成深色模式变体,资料强调这是“真正的深色模式,而非简单反色”。

使用方式

资料描述的工作流程为:

  1. 确定品牌色与风格方向。
  2. 使用 uiux_generate_palette 生成调色板,覆盖上述品牌、中性、语义、表面、文本、边框与交互色。
  3. 生成深色模式变体。
  4. 以适合项目的格式输出,例如 CSS 变量、Tailwind 或 shadcn 主题。

最终输出为完整的主题配置,可直接粘贴到项目中。

适用场景

  • 需要为新项目建立一套完整的浅色/深色主题。
  • 已有主题需要改进或补全颜色系统。
  • 需要基于品牌色快速生成配套的语义色、表面色与交互色。
  • 需要输出可直接用于 CSS 变量、Tailwind 或 shadcn 的主题配置。

限制

资料未提供该技能的具体安装命令、依赖环境、支持的框架版本、收费方式或价格信息,这些内容暂未提供。