设计系统

Stitch Design Taste

写一份 DESIGN.md,引导 Google Stitch 做出不落俗套的界面。

这是什么

生成一份为 Google Stitch 界面生成优化过的 DESIGN.md,把氛围、颜色、字体、组件、布局、动效和一份明确的禁用清单都写进去。

Semantic Design System Skill for Google Stitch. Generates agent-friendly DESIGN.md files that enforce premium, anti-generic UI standards — strict typography, calibrated color, asymmetric layouts, perpetual micro-motion,
来自上游 SKILL.md

它对设计意味着什么

  • Stitch 生成的界面统一继承一个饱和度低于 80% 的强调色,而不是霓虹紫渐变。
  • 居中首屏和三栏等宽卡片超过设定的多样性阈值就会被禁用。
  • 加载和空状态做成骨架屏式的排版,而不是千篇一律的转圈图标。

包含哪些内容

  • Overview
  • Prerequisites
  • Analysis and synthesis instructions
  • Output format
  • Best practices
  • Common pitfalls to avoid

如何安装

Stitch Design Taste

  1. 克隆这个仓库。

    git clone https://github.com/Leonxlnx/taste-skill
  2. 把 Codex 指向这个 Skill 文件。

    skills/stitch-skill/SKILL.md
  3. 然后描述你想要的界面,Codex 会照着这个 Skill 来做。

如何配合 Codex 使用

  1. 描述项目的调性,Skill 会设定密度、多样性和动效的评分。

  2. 它输出一份七个章节的 DESIGN.md,带具体色值和各颜色的功能角色。

  3. 把这份文件直接喂给 Stitch,或者通过 Stitch MCP server 传进去。

这里的每个插件都免费开源,并附上真实的上游源地址。

在 codex-design 清单上了解更多 ↗

下一步

用 Open Design 做设计,省掉那些配置

你可以自己装这个插件,也可以用 Open Design 在 Codex 外面套一整层精选设计层。自带 API Key,产出归你所有。