brand-guidelines.md：每个AI工具都需要知道你品牌的唯一文件

你花大价钱做了品牌指南。它们以47页PDF的形式躺在Google Drive的某个角落里——那是你的设计机构18个月前交付的。你的开发人员从未打开过它。你的AI工具也无法打开它。每次有人在Cursor中搭建一个着陆页，用Claude撰写营销邮件，或者在v0中构建一个组件时，他们都得从零开始：“我们的主色调又是什么来着？是Inter还是Plus Jakarta Sans字体？我们用圆角还是锐角？”

这种循环——解释品牌，期望它能被记住，纠正不一致的地方——每周都要花费数小时。对于一个团队来说，仅返工成本每月就达数千美元。

Google的Stitch design-md 格式消除了这种循环。而Branding5会自动生成你的完整brand-guidelines.md文件——一键下载，将其放入你的代码仓库，你的团队接触的每个AI工具都能立即了解你的品牌。

什么是 design-md？（为什么人们称之为 DESIGN.md？）

Design-md 是一种基于 Markdown 的纯文本规范，用于品牌和设计指南。它不是一个只有人类（理论上）能阅读的PDF文件，而是一个结构化的.md文件，人和AI系统都能解析、理解并基于它进行构建。

Google创建这种格式是Stitch（他们基于AI的UI生成平台）的一部分，其前提很简单：如果你给AI一个结构良好的品牌系统描述，它就可以生成UI、撰写文案，并做出与品牌一致的设计决策。无需在每次会话中重复自己。

两种名称，一个理念

用这种格式编写的文件有两种名称：

• DESIGN.md — 开发者社区中的简称。它与README.md和CONTRIBUTING.md一起位于项目根目录，Cursor、Windsurf及其他AI编码工具会自动查找它。
• brand-guidelines.md — Branding5使用的名称，因为这个文件包含的远不止视觉规范。它涵盖了你的定位、原型、ICP、声音和策略——完整的品牌系统，而不仅仅是颜色和字体。

无论使用哪个名称都可以。格式和功能是相同的。

brand-guidelines.md 包含哪些内容

一个完整的文件涵盖了你品牌的每个层面，从策略到像素级的规范。以下是Branding5生成的brand-guidelines.md的实际样子：

# Acme Analytics

## 品牌基础

- **定位：** 唯一为非技术营销团队构建的分析平台，无需学习曲线即可获得企业级洞察。
- **原型：** 智者 — 睿智、值得信赖、数据驱动
- **使命：** 让每个营销人员都能掌握数据素养。
- **价值观：** 清晰胜于复杂。准确胜于速度。赋能胜于依赖。

## 理想客户画像 (ICP)

### ICP 1: 增长营销经理

- 28–38岁，中端市场 SaaS (50–500名员工)
- 对复杂的BI工具感到沮丧；需要能够独立构建的仪表板
- 语言模式：“可操作的洞察”、“自助服务”、“实现价值所需时间”
- 主要异议：“这会取代我们现有的BI堆栈吗？”

### ICP 2: 市场副总裁

- 35–50岁，向CMO或CEO汇报
- 关注跨渠道归因和可用于董事会报告的报告
- 基于ROI证明和集成广度进行购买

## 视觉识别

### 颜色

| 角色       | Hex值     | 用途                      |
| ---------- | --------- | ------------------------- |
| 主色       | `#2563eb` | CTA、活跃状态、关键UI元素 |
| 辅色       | `#f8fafc` | 背景、卡片、容器          |
| 强调色     | `#16a34a` | 成功状态、积极指标        |
| 中性色 900 | `#0f172a` | 正文、标题                |
| 中性色 400 | `#94a3b8` | 占位符文本、禁用状态      |
| 错误       | `#dc2626` | 错误状态、破坏性操作      |
| 警告       | `#f59e0b` | 警告状态、注意提示        |

### 排版

| 角色 | 字体家族          | 字重 | 字号 | 行高 | 字距    |
| ---- | ----------------- | ---- | ---- | ---- | ------- |
| H1   | Plus Jakarta Sans | 800  | 48px | 1.1  | -0.02em |
| H2   | Plus Jakarta Sans | 700  | 36px | 1.2  | -0.01em |
| H3   | Plus Jakarta Sans | 700  | 24px | 1.3  | 0       |
| 正文 | Inter             | 400  | 16px | 1.6  | 0       |
| 说明 | Inter             | 500  | 13px | 1.4  | 0.01em  |
| 代码 | JetBrains Mono    | 400  | 14px | 1.5  | 0       |

### 间距与布局

- 基本单位：8px
- 组件内边距：16px (紧凑), 24px (默认), 32px (宽敞)
- 区块间距：64px (桌面), 48px (移动)
- 最大内容宽度：1200px
- 边框圆角：8px (卡片), 12px (弹窗), 9999px (药丸/按钮)

### 阴影与海拔 (层级)

- 卡片: `0 1px 3px rgba(0,0,0,0.08)`
- 下拉菜单: `0 4px 12px rgba(0,0,0,0.12)`
- 弹窗: `0 8px 32px rgba(0,0,0,0.16)`

## 品牌声音与语调

- **声音：** 直接、自信、无行话。我们解释，不训斥。
- **语调变化：** 入职时更亲切，销售文案中更坚定，文档中精确且中立。
- **句子风格：** 短句。主动语态。以利益点引导。
- **避免：** 被动结构、“利用 (leverage)”、“协同 (synergy)”、填充词，产品UI中使用感叹号。

### 示例

- ✅ “一键查看哪些活动带来收入。”
- ❌ “我们创新的平台利用尖端技术，为您的营销团队提供一流的分析解决方案。”

## 组件指南

### 按钮

- 主按钮：填充式，`#2563eb`，白色文本，全圆角，最小高度44px
- 辅按钮：描边式，1px边框`#2563eb`，透明背景
- 幽灵按钮：无边框，仅文本，用于导航和次级操作
- 所有按钮：16px水平内边距，字重600，不高亮

### 卡片

- 背景：白色，8px边框圆角，微弱阴影
- 内边距：24px
- 标题：H3字重，8px底部外边距
- 始终包含一个清晰的CTA或下一步操作

### 表单

- 标签位于输入框上方，字重500
- 输入框高度：44px，8px边框圆角，1px中性色-300边框
- 错误消息位于输入框下方，红色，13px
- 必填字段用\*标记（而非仅用颜色区分）

## 准则与禁忌

- ✅ 每个部分始终包含一个清晰的CTA
- ✅ 在示例和截图中始终使用真实数据，绝不使用“Lorem ipsum”
- ✅ 测试对比度——最小WCAG AA (文本为4.5:1)
- ❌ 组件中使用的颜色不得超过3种
- ❌ 不要使用人们指着屏幕的库存照片
- ❌ 避免文本超过2行的居中对齐正文

这是纯文本。没有专有格式。没有特殊工具。把它交给任何AI工具——Cursor、Claude、Stitch、v0、Bolt、Copilot——你的品牌就会成为一个约束层，自动塑造每一个输出。

为什么这在当下如此重要

三大因素汇聚，使得机器可读的品牌指南变得紧迫而非可选项：

1. AI工具现在编写了大部分代码和文案

Cursor、GitHub Copilot、Claude、v0、Bolt、Lovable——开发者和营销人员借助AI辅助，出货速度比以往任何时候都快。但这些工具对你的品牌一无所知，除非你告诉它们。每次会话，每个提示，你都在重新解释你的调色板。这不是一个工作流——这是速度的代价。

代码仓库中的一个brand-guidelines.md文件可以永久消除这种代价。

2. Google正在将 design-md 推向标准

当Google通过像Stitch这样的产品发布格式规范时，生态系统会予以关注。Figma插件、VS Code扩展和AI组件生成器已经开始在项目根目录中寻找DESIGN.md。今天就把文件准备好，意味着未来的工具将无缝运行——无需迁移，无需返工。

3. AI速度下的品牌一致性需要机器可读的规则

如果你的团队每月生成50篇博客文章，每周20个广告变体，每冲刺一个新着陆页，那么Google Drive中的PDF是无用的。品牌规则需要存在于生成发生的地方——在代码仓库中，在提示上下文中，在工具的内存中。

PDF 与 brand-guidelines.md：并排比较

PDF并非在利益相关者演示中消亡。但在日常执行中——当AI工具进行生成时——纯文本占据了决定性的优势。

如何将 brand-guidelines.md 与 Google Stitch 结合使用

Google Stitch 读取你的brand-guidelines.md并用它来约束其UI生成。它不会生成通用的Material组件，而是输出与你的颜色系统、排版、间距和组件约定相匹配的UI。

工作流程分为三步：

1. 上传或放置文件。 将 brand-guidelines.md 放在项目根目录，或直接在Stitch界面中上传。
2. 自然地发出提示。 提出你的需求：“生成一个包含三个定价层级和一个突出显示的热门计划的定价部分。”
3. 获得符合品牌规范的输出。 Stitch会自动应用你的颜色、排版层级、按钮样式和间距。基本内容无需设计审核。

结果不仅更贴近你的品牌，而且发布速度更快，因为你跳过了通常会耗费整个下午的纠正环节。

与 Cursor、Copilot 和 AI 编码工具结合使用

将 DESIGN.md（或 brand-guidelines.md）放入你的代码仓库根目录并在提示中引用它：

Cursor：

@DESIGN.md 生成一个首页的英雄区。使用文件中的主要CTA样式、标题排版和颜色系统。

GitHub Copilot（工作区模式）：

#file:DESIGN.md 构建一个客户评价卡片网格组件，使用此处定义的卡片指南和间距系统。

Claude / ChatGPT（粘贴或附加文件）：

这是我的品牌指南 [附件：brand-guidelines.md]。请撰写三个符合品牌声音并面向ICP 1（增长营销经理）的首页标题选项。

v0 / Bolt / Lovable： 将 brand-guidelines.md 作为项目文件上传，或将相关部分粘贴到你的提示中。这些工具将在每次生成时应用你的颜色、字体和组件规范。

回报是：从未阅读过品牌指南的开发人员，从他们的第一个提示开始就能生成符合品牌规范的代码。约束嵌入在工作流程中——而不是通过审核周期和Slack消息来强制执行。

超越视觉：文件中包含策略为何能改变一切

大多数设计系统文件只停留在颜色和字体。而Branding5提供的brand-guidelines.md则深入得多——这种深度正是将AI输出从“看起来正确”转变为“感觉正确”的关键。

品牌基础告诉AI品牌做出这些选择的原因。当AI知道你是一个以非技术营销人员为目标的智者原型时，它不仅仅会选择正确的按钮颜色，还会撰写清晰自信而非夸张浮躁的文案。

理想客户画像为AI提供受众背景，以生成相关信息。面向市场副总裁的标题与面向增长营销经理的标题截然不同。文件中没有ICP，AI就会猜测。有了它们，AI就能精准定位。

包含具体示例（好与坏）的声音和语调指南是提高文案质量的最具杠杆作用的部分。一个写得好的“应做/不应做”示例比一百字的抽象声音描述更能教会AI。

准则与禁忌充当硬性约束。“组件中使用的颜色不得超过3种”和“每个部分始终包含一个CTA”是AI每次都能严格遵守的规则。没有歧义，没有偏差。

Branding5 如何生成你的品牌指南

在Branding5完成你的品牌分析后，你的brand-guidelines.md即可从仪表板下载。以下是幕后发生的事情：

1. 你的品牌策略为文件提供内容。 定位、原型、ICP、竞争对手分析、声音语调——你在Branding5中建立的一切都直接流入结构化的Markdown输出。
2. 视觉规范源于你的定位。 颜色、排版和组件规范的生成旨在匹配你的品牌个性——而非从通用模板中提取。
3. 输出遵循design-md规范。 Stitch和兼容工具可以原生解析它。无需转换，无需重新格式化。
4. 即刻可用。 将它放入你的仓库，附加到你的AI工具，或与你的团队分享。一个文件，所有工具，从第一天开始。

你在Branding5中花费的30分钟会生成：

• 一份供你的利益相关者和投资者使用的策略PDF
• 供你的营销团队使用的消息框架
• 一份供你的工程和设计团队使用的所有AI工具的brand-guidelines.md

无需文案。无需手动格式化。无需Markdown专业知识。

开始：五分钟清单

已经有品牌策略了吗？以下是如何在五分钟内从零开始建立一个AI就绪的品牌系统：

1. 生成你的文件。 在Branding5中运行你的品牌分析，并从你的仪表板下载 brand-guidelines.md。
2. 将其放入你的仓库根目录。 如果你的团队更喜欢开发者约定，可以将其命名为 DESIGN.md，或为了清晰起见保留 brand-guidelines.md。
3. 告知你的团队。 分享一条简短信息：“我们的品牌指南现在位于项目根目录的 DESIGN.md 中。在每个AI提示中引用它。”
4. 在每次AI会话中引用它。 在Cursor中使用 @DESIGN.md，在Claude或ChatGPT中附加它，在v0或Bolt中上传它。
5. 保持更新。 当你的品牌发展时，更新文件并提交。Git会跟踪更改。每个工具都会即时获取更新。

就是这样。没有入职演示。没有设计审核瓶颈。Slack中不再出现“我们的品牌颜色是什么？”的疑问。

总结

AI工具正在编写你的代码、生成你的文案、搭建你的组件。唯一的问题是它们是否符合品牌规范——还是随心所欲。

brand-guidelines.md一次性回答了这个问题。然后，它会在每次生成时，在每个工具中，为你的团队中每个人自动再次回答这个问题。

Google的Stitch格式正在使机器可读的品牌指南成为一个标准。DESIGN.md正成为开发者期望在项目根目录中找到的文件。现在就采用它的品牌将更快发布，保持更高的一致性，并减少因纠正AI输出失误而浪费的时间。

你的品牌策略已在Branding5中。你的brand-guidelines.md只需一键即可获得。

常见问题

DESIGN.md 和 brand-guidelines.md 有什么区别？

它们是相同的格式。DESIGN.md是开发者社区流行的简称——它与README.md的命名约定相呼应。brand-guidelines.md更具描述性，表明该文件包含品牌策略（定位、声音、ICP），而不仅仅是视觉规范。使用你的团队更喜欢的任何名称；AI工具会以相同的方式解析两者。

我需要了解 Markdown 才能创建或编辑文件吗？

不需要。Branding5会根据你的品牌分析自动生成文件。如果你想稍后手动编辑，Markdown只是带有简单格式（#表示标题，-表示列表，**表示粗体）的纯文本。任何人都可以在两分钟内学会基础知识。

哪些AI工具支持 design-md / DESIGN.md？

Google Stitch 原生读取它。Cursor、GitHub Copilot、Windsurf、Claude、ChatGPT、v0、Bolt 和 Lovable 在你引用或附加文件时都能与它配合使用。由于它是纯Markdown，任何基于LLM的工具都可以解析并遵循它——无需插件或集成。

我的 brand-guidelines.md 应该有多详细？

详细到足以消除歧义。至少应包括你的调色板及使用规则、排版规范、按钮/卡片/表单约定以及带示例的声音指南。你的准则与禁忌越具体，AI输出的一致性就越高。Branding5默认生成一个全面的文件——你总是可以删减不需要的部分。

随着品牌发展，我如何保持文件同步？

像对待任何其他源文件一样对待它：编辑、提交、推送。因为它存储在Git中，你的团队可以准确地看到什么何时发生了变化。如果你在Branding5中重新运行品牌分析，你可以下载更新版本并替换旧文件。没有代理费用，也没有长达一个月的修订周期。

我可以将 brand-guidelines.md 用于非编码任务，例如撰写博客文章或广告文案吗？

当然可以。在提示Claude、ChatGPT或任何写作助手时，附加文件（或粘贴品牌声音和ICP部分）。声音指南、语调示例和受众详情是专门设计来改善AI生成的文案的——而不仅仅是代码。

获取你的 brand-guidelines.md

在Branding5中运行你的品牌分析，并下载一份符合design-md规范的brand-guidelines.md (DESIGN.md)——为Google Stitch、Cursor、Copilot和你的整个AI工具栈做好准备。

生成你的 brand-guidelines.md →