Skip to content

nexu-io/open-design

⭐ 35,009  ·  #20  ·  TypeScript

🎨 Local-first, open-source alternative to Anthropic's Claude Design. ⚡ 19 Skills · ✨ 71 brand-grade Design Systems 🖼 Generate web · desktop · mobile prototypes · slides · images · videos · HyperFrames 📦 Sandboxed preview · HTML/PDF/PPTX/MP4 export 🤖 Runs on Claude Code / Codex / Cursor / Gemini / OpenCode / Qwen / Copilot / Hermes / Kimi CLI.

TypeScript agent-skills ai-agents ai-design Skill

项目分析

🎯 定位Agent 能力增强
💡 核心价值为 AI 编码 Agent 提供标准化的 Skills 和 Prompt 模板,覆盖特定场景(代码审查、调试、架构设计等),让 Agent 在这些场景下输出质量更高
👥 适合谁使用 Claude Code/Cursor/Codex 等 Agent 工具的开发者,想提升 Agent 在特定任务上的表现

为什么值得关注

35,009 Stars,社区活跃度不错,说明解决了真实痛点。使用 TypeScript 开发。核心特色:The open-source alternative to [Claude Design][cd]. Local-first, web-deployable, BYOK at every layer — 16 coding-agent CLIs auto-detected on your PATH (Claude Code, Codex, Devin for Terminal, Cursor Agent, Gemini CLI, OpenCode, Qwen, Qoder CLI, GitHub Copilot CLI, Hermes, Kimi, Pi, Kiro, Kilo, Mistral Vibe, DeepSeek TUI) become the design engine, driven by 31 composable Skills and 72 brand-grade Design Systems. No CLI? An OpenAI-compatible BYOK proxy is the same loop minus the spawn.。

AI 深度分析报告

一句话总结

用本地AI代理驱动设计的开源替代方案。

核心功能

  • 多代理引擎支持:自动检测并集成 16 种主流编码代理 CLI(Claude Code、Codex、Cursor Agent、Gemini CLI 等),将其作为设计引擎。无 CLI 时,可通过 OpenAI 兼容的 BYOK 代理运行。
  • 可组合技能系统:内置 31 种可组合的 AI 设计技能(Skills),覆盖原型生成、样式调整、导出等设计全流程。
  • 品牌级设计系统库:预置 72 个品牌级设计系统(Design Systems),可直接复用或作为设计起点。
  • 多格式输出:支持生成网页、桌面、移动端原型,以及幻灯片、图片、视频、HyperFrames 等。输出格式包括 HTML、PDF、PPTX、MP4。
  • 沙箱预览与本地优先:提供沙箱化预览环境,所有处理在本地完成,保障数据隐私。

技术架构

  • 主要技术栈:TypeScript、Next.js,兼顾 Web 部署与桌面应用能力。
  • 架构亮点
    • 代理抽象层:通过统一的接口抽象,支持 16 种不同代理 CLI 的自动检测与适配,实现“BYOK(Bring Your Own Knowledge/Key)”设计工作流。
    • 技能组合模式:31 个技能以模块化方式组织,可灵活组合形成复杂设计流程,类似函数式编程中的组合模式。
    • 本地优先设计:核心逻辑在客户端执行,仅需要代理 CLI 或 API Key,无需依赖中心化服务。

快速上手指南

bash
# 1. 克隆仓库
git clone https://github.com/nexu-io/open-design.git
cd open-design

# 2. 安装依赖
npm install

# 3. 启动开发服务器
npm run dev

# 4. 打开浏览器访问 http://localhost:3000
# 确保已安装至少一个支持的 CLI 代理(如 Claude Code)

优劣势与适用场景

优势

  • 高度灵活:支持 16 种代理和 BYOK,不绑定特定 AI 供应商。
  • 本地优先:数据不外传,适合对隐私敏感的团队。
  • 开箱即用:72 个设计系统和 31 个技能大幅降低上手成本。
  • 多格式输出:覆盖从原型到最终交付的多种格式需求。

劣势

  • 依赖 CLI 代理:需要用户自行配置并安装至少一个支持的代理 CLI,增加入门门槛。
  • 生态尚在早期:35k Stars 说明关注度高,但设计系统库和技能库的成熟度需社区持续贡献。
  • 文档深度不足:README 侧重功能展示,缺少详细的 API 文档和架构说明。

适用场景

  • AI 驱动的设计团队:希望将 AI 代理深度集成到设计工作流中。
  • 隐私敏感项目:需要本地处理设计数据的团队。
  • 多工具用户:使用不同 AI 代理(如 Claude、Gemini、Copilot)的开发者。
  • 设计系统构建者:需要快速创建或迭代品牌设计系统的团队。

社区与热度

  • Stars:35,009,增长迅速,说明项目受到广泛关注。
  • Forks:数量可观,社区参与度高。
  • 近期更新:最后更新于 2026-05-09,保持活跃维护。
  • 社区渠道:拥有 Discord 和 X(Twitter)账号,提供用户支持和更新通知。
  • 多语言文档:提供英语、西班牙语、葡萄牙语、德语、法语版本,国际化程度高。

结论:Open Design 是 AI 辅助设计领域一个极具潜力的开源项目。其“本地优先 + 多代理兼容”的设计理念,与当前 AI 工具碎片化的趋势形成鲜明对比。对于技术能力较强、追求设计工作流自主可控的团队,是值得深入研究的工具。

技术信息

  • 💻 语言: TypeScript
  • 📂 Topics: agent-skills, ai-agents, ai-design, byok, claude
  • 🕐 更新: 2026-04-29
  • 🔗 访问 GitHub 仓库

数据更新于 2026-04-08 · Stars 数以 GitHub 实际数据为准

热点项目数据来自 GitHub API,实时更新