Claude Design 的开源替代来了：Open Design 正式发布

公众号名称：程叙架构与AI.

作者名称：AI兴观点

发布时间：2026-05-06 19:28

原文链接：https://github.com/nexu-io/open-design

✅点击上方🔺公众号🔺关注我✅

​

Claude Design 上个月刚出圈的时候，很多人都被那个体验震住了——输入一段需求，AI 直接给你出一个可交互的高保真原型，不用切 Figma 不用写前端代码。

但是冷静下来一看，嗯？闭源的、付费的、只能跑在云端、只能绑 Anthropic 的模型和 Anthropic 自己的 skill。

你要是想换个模型跑？不行。想本地运行？不行。想接入自己的 agent 工作流？还是不行。

那有没有人把它给开源了？

有，而且做得很认真——Open Design。

​

一句话说清楚

Open Design = Claude Design 的开源替代。同一套「丢需求→出 artifact」的交互逻辑，但每个环节都换得掉。

GitHub 上的 @wherecall1 总结得很到位：

​

Claude Design火了但它闭源、付费、云端only。 Open Design把它开源了—— 核心逻辑一模一样，但每个环节都能换：

• Agent：Claude Code / Codex / Cursor / Gemini / Qwen… 11种随便切 • 模型：DeepSeek / Groq / vLLM / 任意OpenAI兼容接口，不绑 Anthropic • 设计系统：129个内置（Linear/Stripe/Vercel/小红书…），也能自己加 • 技能：31个，覆盖网页原型/PPT/仪表盘/mobile App/邮件/文档…

全程本地运行，数据存在SQLite，不上传任何服务器。

点击直达 → https://github.com/nexu-io/open-design

​

它到底能干什么？

你打开浏览器，输入一个需求——比如「帮我做一个 SaaS 着陆页，风格参考 Linear」，然后在沙盒 iframe 里实时预览生成的 artifact：

完整的流程是：

1. Agent 先问清楚需求：使用场景、受众、风格偏好、有无品牌色——把模糊的「做个页面」变成清晰的 brief
2. 选视觉方向：如果没品牌，5 套预设方向（Editorial Monocle / Modern Minimal / Tech Utility / Brutalist / Soft Warm）任选，一套配色+字体的完整 palette 就定下来了
3. Agent 出规划：一个实时的 Todo 卡片在界面上展示进度——这一步在做什么、下一步要干什么一清二楚
4. 预览 artifact：生成的内容在沙盒 iframe 里实时渲染，所见即所得
5. 导出：HTML / PDF / PPTX / ZIP，直接拿走

最让人惊喜的，是它的「可替换性」

Claude Design 最让人头疼的限制，在 Open Design 这里全都不存在：

Agent 随意换 — 它自动检测你 PATH 上的 15 种 coding agent CLI：Claude Code、Codex、Cursor Agent、Gemini CLI、OpenCode、Qwen、GitHub Copilot CLI、DeepSeek TUI……一键切换。一个 agent 不满意，换个试试。

模型随意换 — 不绑任何模型。DeepSeek、Groq、vLLM、自托管 SGLang，只要兼容 OpenAI 接口就能接。想用 Claude 的模型也行，但它不强制。

设计系统 129 套 — Linear、Stripe、Vercel、Airbnb、Tesla、Notion、Apple、小红书……真实品牌的设计规范直接拿来用，每个系统都有自己的色彩体系和设计规范说明。还可以自己加。

技能 31 个 — 网页原型、SaaS 着陆页、仪表盘、移动 App、游戏化界面、PPT deck、邮件模板、数字指南……基本覆盖了你能想到的所有设计场景。

它跑在哪里？你的本地机器上

就四个命令：

​

git clone https://github.com/nexu-io/open-design.git
pnpm install
pnpm --filter @open-design/daemon build
pnpm tools-dev

打开浏览器，开干。所有数据存在本地的 SQLite，不上传任何服务器。

想部署到 Vercel 让团队用？也可以，web 层单独部署就行。

​

它站在巨人的肩膀上

Open Design 不是从零做的。它明确致敬了四个开源项目：

• 花叔的画术 — 设计哲学的指南针。anti-AI-slop checklist、五维自评审、方向选择器背后的「5 流派 × 20 种设计哲学」
• 歸藏的杂志风 PPT skill — 内嵌的 deck 模式，杂志排版 + WebGL hero 背景
• OpenCoworkAI/open-codesign — 第一个开源的 Claude Design 替代品。流式 artifact 渲染、沙盒预览 iframe、5 种导出格式
• multica-ai/multica — 本地 daemon 架构，PATH 扫描式 agent 检测

每个项目都有自己的亮点，OD 把它们整合成了一个完整的闭环。

​

和 Claude Design 的核心区别

	Claude Design	Open Design
开源	❌	✅ Apache-2.0
本地运行	❌ 仅云端	✅
Agent 可换	❌ 仅 Claude Code	✅ 15种
模型可换	❌ 仅 Anthropic	✅ 不限
设计系统	自有一套	✅ 129套内置
导入 Claude Design	❌	✅ 支持ZIP导入
数据存储	云端	✅ 本地SQLite
付费	✅ 按量付费	✅ 免费

谁应该试试

如果你做设计 — 用 Open Design 快速出原型，比启动 Figma 快一个量级。31 个技能基本覆盖了日常产出。

如果你写代码 — 把它接进你的 agent 工作流，让 Claude Code 或 Cursor 帮你输出设计 artifact，省掉”等设计师出稿”的环节。

如果你在用 Claude Design 但觉得限制太多 — Open Design 支持直接导入 Claude Design 的导出 ZIP，无缝迁移。

如果你单纯想看看「开源版 Claude Design」长什么样 — 四个命令跑起来，几分钟就能上手。

​

总结

Open Design 不是简单山寨 Claude Design。它做了一件更有价值的事：把这套「AI 设计 artifact」的工作流解耦了。

之前你只能选「全盘接受 Anthropic 的方案」或者「不玩」。现在你可以拆开来看——agent 用自己喜欢的、模型用自己习惯的、设计系统用自己团队的——然后在本地运行，数据不离开你的机器。

这大概就是开源的意义：让一个好东西，从被一个公司垄断，变成大家都能参与和定制。

​

---

项目地址： https://github.com/nexu-io/open-design

如果觉得这篇文章有帮助，欢迎点赞、在看、转发！有问题也可以在评论区留言，我会尽量回复！

---

AI兴观点 程叙架构与AI.

Read more