⭐ 79.6K Stars · Apache-2.0 · TypeScript · 本地优先桌面应用
项目简介
Open Design 是 Anthropic Claude Design 的开源替代方案——一个本地优先(local-first)的桌面应用,让你的 Claude Code / Codex / Cursor / Gemini 等编码智能体直接化身”设计引擎”,生成网页、桌面、移动端原型、实时仪表盘、演示文稿、图片与视频,并导出为 HTML / PDF / PPTX / MP4 真实文件。

安装要求与过程
环境要求
- 桌面应用:macOS(Apple Silicon / Intel x64)、Windows(x64)、Linux(AppImage)——无需 Node / pnpm / 克隆仓库。
- 自托管:Docker + Docker Compose;源码运行需 Node 24、pnpm 10.33.x。
- 编码智能体:Claude Code、Codex、Cursor、Copilot、OpenClaw、Gemini、Hermes、Kimi、Trae、OpenCode 等 25+ 本地 CLI,或任意 OpenAI 兼容端点(BYOK)。
快速安装
- 下载桌面应用(推荐,零配置):前往官网或 GitHub Releases 下载对应平台安装包;安装后自动检测 PATH 上的编码智能体,加载 100+ 功能技能、渲染模板目录与 151 套设计系统。
- 装进编码智能体(无界面):
od mcp install <agent>(<agent>= claude | codex | cursor | copilot | gemini | hermes | kimi | trae | opencode …);或用托管脚本curl -fsSL https://open-design.ai/install.sh | sh -s <agent>。 - Docker 自托管:
git clone https://github.com/nexu-io/open-design.git cd open-design/deploy cp .env.example .env echo "OD_API_TOKEN=$(openssl rand -hex 32)" >> .env docker compose up -d # 打开 http://localhost:7456 - 源码运行:
git clone https://github.com/nexu-io/open-design.git cd open-design corepack enable && pnpm install pnpm tools-dev run web
核心功能

- 智能体原生、模型无关:不绑定任何厂商 Agent,你 PATH 上已有的 claude / codex / cursor / copilot / hermes / kimi 就是设计引擎,一键切换;一条
od mcp install <agent>把 MCP 服务器接入 25+ 编码智能体。 - 品牌级 DESIGN.md 设计系统:每一帧渲染都读取当前包的
DESIGN.md作为品牌契约;仓库内置 151 套品牌级设计系统(Claude、Stripe、Figma、Apple、NVIDIA…),丢进文件夹即被识别。 - 多形态产物,单一项目:Studio 支持原型(web / desktop / mobile 单页)、实时仪表盘 / artifact、演示文稿(deck)、图片、视频与 HyperFrames 动态图形,统一导出 HTML / PDF / PPTX / MP4。
- 四层可组合:插件(可运行工作流)+ 功能技能(Agent 行为)+ 设计模板(渲染蓝图)+ 设计系统(品牌),全部用可移植、可版本化的目录,任何人都能创作与发布;官方 277 个插件 + 183 个可复用示例。
- 本地优先 + BYOK 隐私:原生桌面应用(macOS / Windows)+ Docker + Vercel;所有数据在你本机、团队服务器或部署项目里运行,BYOK 代理具备 SSRF 防护,沙箱 iframe 预览。

典型使用场景
- 一句话生成落地页:在入口视图输入 brief,智能体结合
saas-landing模板与 Linear 设计系统,流式生成带 hero / 特性 / 定价 / CTA 的可运行着陆页,直接导出 HTML 部署。 - 实时数据仪表盘:用
dashboard模板生成带侧边栏的管理 / 分析看板,作为 live artifact 实时刷新,而非静态截图。 - 品牌统一的演示文稿:用
guizang-ppt/html-ppt模板生成杂志风 Web PPT;或把现有 git 仓库 +DESIGN.md交给智能体,自动把真实组件重构到品牌规范(含 Figma / Pencil → React / Next / Vue 迁移插件)。


推荐理由
作为天天和编码智能体打交道的人,最打动我的是它把”设计”从闭源付费的云端玩具,变成了你笔记本上的文件系统——你的 CLI 是引擎,笔记本是工作室,团队的 DESIGN.md 是品牌契约。相比 Claude Design 的封闭锁定,Open Design 的 agent-native + 模型无关 + Apache-2.0,让我可以随意换模型、自托管、调用 151 套现成设计系统,还能用 277 个插件把 Figma 工作流迁到 React。对想把”vibe coding”从代码延伸到 UI / 海报 / 演示的人来说,这是目前最完整、最开放的一个选择。
下载地址
- 官网:https://open-design.ai
- GitHub 仓库:https://github.com/nexu-io/open-design
- 下载 / Releases:https://github.com/nexu-io/open-design/releases
- Open Design Cloud:https://open-design.ai/cloud/
- Discord 社区:https://discord.gg/mHAjSMV6gz












