SuperAPI AI 工具集

design-md

设计与创作

查看项目

更新于 10-16 03:42

技能介绍

用途:当用户要求做出某品牌风格的 UI、落地页或组件(例如“像 Linear”“有 Stripe 的感觉”“苹果风”),或需要从真实设计系统而非凭空发明来选定设计方向,以及在交给前端设计流程前先拿到一套具体设计令牌时,可使用本技能。

主要能力:库中每个品牌一个 DESIGN.md,记录带语义角色的配色、字体层级、组件规则、布局原则与阴影/层级。索引本身按情绪与主色列出 74 个品牌,足以直接挑选方向。资料还包含配套的 preview.html / preview-dark.html 视觉参考。工作流为:先按索引挑选最接近需求的品牌,再读取 <library>/design-md/<brand>/DESIGN.md,将其颜色角色、字体比例、组件与层级当作硬性规范执行,可选地继续交给 frontend-design、tailwind-design-system、shadcn、design-review 转成生产组件。

定位库的方式:依次查找 DESIGN_MD_DIR 环境变量;常见位置 ~/Developer/awesome-design-md、~/dev/awesome-design-md、~/awesome-design-md 或当前项目内的 awesome-design-md 目录;若都不存在则克隆:git clone --depth 1 https://github.com/voltagent/awesome-design-md.git ~/Developer/awesome-design-md。品牌文件路径固定为 <library>/design-md/<brand>/DESIGN.md。索引按分组给出品牌名、主色与一句话描述,例如 AI 与 LLM、开发者工具与平台、生产力协作 SaaS、金融加密、电商消费出行、媒体娱乐、汽车、企业硬件电信航天,以及 90 年代至 00 年代的复古风格。挑色困难时不要自行编造,直接复制所选品牌 DESIGN.md 中的语义颜色角色。

适用场景:为智能体提供明确的设计方向,做落地页、组件或设计系统起点,或在多个真实品牌风格之间做选择。

限制:资料未提供该技能的具体安装方式、依赖、授权细节、价格、效果保证与平台支持,均暂未提供;源内容为 voltagent/awesome-design-md(MIT),本技能只是其上的索引与工作流层。使用时应以所选品牌的 DESIGN.md 实际内容为准,不得据此编造未列出的能力。