Codex Design 和 Google Stitch 对比。
Google Stitch 和 Codex Design 都会把 AI 生成的界面摆在一块画布上。真正的区别在于画布在哪里：Stitch 是 Google Labs 推出的独立设计工具，Codex Design 则是给 Codex 加上一块画布，而最后负责把设计做出来的，正是 Codex 这个编程 agent。
更新于 2026年11月6日 · 阅读约 6 分钟
简短回答
两者都很适合用 AI 探索 UI。如果你不用编程 agent，Stitch 上手更快：打开一个浏览器标签页，描述你要的界面就行。如果你本来就在用 Codex 写代码，Codex Design 更顺手：设计稿就放在代码旁边，同一段对话接着就能把它做出来。
- 选 Google Stitch： 如果你想在浏览器里直接开始、什么都不用装，喜欢用语音讨论想法，或者打算接着在 Google AI Studio、Antigravity 里继续做。
- 选 Codex Design： 如果你已经在用 Codex，希望每个设计都是保存在自己电脑上的实时 HTML 页面，既能可视化地改，也能通过对话打磨，最后交给同一个 agent 实现。
两款工具分别是什么
Google Stitch 是 Google Labs 推出的设计工具，Google 把它定位成一块 AI 原生的软件设计画布。你用文字、语音或图片描述界面，它的设计 agent 就会在一块无限画布上生成高保真界面。你可以把多个界面串成可点击的原型，把设计规则存进 DESIGN.md 文件，再把作品导出到 Google AI Studio 和 Antigravity，或者通过 Netlify 发布上线。Stitch 还提供 MCP 服务器和 SDK，方便和其他工具打通。
Codex Design 是我们为 Codex 做的独立插件。它加了一块本地画布，Codex 设计的界面会以实时 HTML 页面的形式出现在上面，旁边可以放设计稿图片和你的参考图。选中一个元素，就能在侧边栏里改字体、颜色和间距，也可以继续让 Codex 帮你调整。画布项目都保存在你自己的电脑上。
逐项对比
| Google Stitch | Codex Design | |
|---|---|---|
| 能做什么 | 高保真 UI 设计和可点击原型 | 网站和 App 设计稿（实时 HTML 页面），以及设计稿图片 |
| 在哪里运行 | 浏览器里，网址是 stitch.withgoogle.com | Codex 里，画布在你自己的电脑上（macOS 和 Linux） |
| 产出和代码 | 前端代码、可以粘贴到 Figma 的设计、DESIGN.md；可导出到 AI Studio 和 Antigravity，用 Netlify 发布 | 本地项目里的 HTML 页面和图片；选定的设计可以接着让 Codex 在你的代码里实现 |
| 价格 | Google 没有公布 Stitch 的价格 | 免费版可用一个画布项目；Pro 每月 5 美元，项目数量不限。Codex 的用量另外计算 |
| 适合谁 | 不想搭开发环境、想快速探索 UI 想法的人，尤其是常用 Google 工具的团队 | 想在动手开发前对比、打磨几个 UI 方向的 Codex 用户 |
两款产品都更新得很快。本文对比的内容以 2026 年 11 月 6 日两者官网和文档上的信息为准。
什么时候该选 Google Stitch
下面这些情况，Stitch 是更好的选择：
- 你不用编程 agent。 Stitch 在浏览器标签页里就能用。Codex Design 则需要支持插件的 Codex、Codex CLI，以及电脑上装好 Node.js。
- 你习惯边说边想。 你可以直接对着 Stitch 画布说话，让它点评设计、实时修改。
- 你想尽快做出可点击的原型。 Stitch 能把界面串成一个可以点着走一遍的流程，还能帮你生成接下来该有的界面。
- 你的工作围绕 Google 生态。 设计可以导出到 Google AI Studio 和 Antigravity，用 Netlify 还能直接发布到网上。
- 你想从一个现有网站起步。 Stitch 能从任意网址里提取出一套设计系统。
什么时候该选 Codex Design
- 你已经在用 Codex 开发。 画布就在写代码的那个 agent 里面，设计和开发之间没有导出这一步。选好方向后，在同一段对话里让 Codex 把它实现出来就行。
- 你要的是 HTML，而不是界面的图片。 每个界面都是实时 HTML 页面，带元素检查器和页面版本历史。
- 你要拿参考图来对比方向。 把 Codex 生成的设计稿图片、你自己的参考图，和 HTML 界面并排放在一起。
- 你希望作品留在自己电脑上。 画布项目保存在本地。你分享给 Codex 的内容，仍按 Codex 的方式处理。
- 你想要简单明了的价格。 不需要单独的 API key，也没有额外的 token 钱包。一个画布项目免费，Pro 每月 5 美元，项目数量不限。Codex 的使用权限和套餐额度照常适用。
两个一起用
Stitch 和 Codex 用的是同一种设计系统格式。DESIGN.md 最早出自 Stitch，而只要你把 DESIGN.md 文件指给 Codex，它就会照着读。从 Stitch 项目里导出这个文件，放进你的代码仓库，Codex 在画布上设计的界面就会沿用同样的颜色、字体和间距。参见 DESIGN.md 是什么，怎么用。
常见问题
Codex Design 能替代 Google Stitch 吗？
如果你用 Codex，可以。两者都能根据描述在画布上生成 UI。Stitch 是浏览器里的独立工具；Codex Design 把画布加进 Codex，设计和代码都在一个地方。如果你不用 Codex，Stitch 是更直接的选择。
Stitch 导出的 DESIGN.md 能在 Codex 里用吗？
能。DESIGN.md 是 Google Labs 推出的开放格式，Stitch 支持导入和导出。把文件放进项目，让 Codex 遵循它就行。格式和设置方法见 DESIGN.md 指南。
用 Codex Design 要在 Codex 之外另外付费吗？
Codex Design 免费版可用一个画布项目，Pro 每月 5 美元，项目数量不限。它不包含模型用量：Codex 生成内容消耗的仍是你 Codex 套餐里的额度。详见价格。