一句话定位

把本地的 Open Design 设计工作区以 stdio MCP 服务的方式挂到 DeepSeek Harness（或任何兼容 MCP 的 Agent），让 dsh 能直接读取项目文件、预览生成的设计稿，并通过 od 调用本地已安装的编码 Agent CLI 产出网页原型、PPT、海报、视频等设计产物。

核心能力

• 以 stdio MCP 服务形式把项目列表、文件读取、设计稿预览等工具暴露给 dsh
• 通过 od 后端自动调用本地 27 套 Agent CLI 中的任意一个生成设计稿，无需 dsh 自己写文件
• 复用 DeepSeek Harness 自带的会话存档与冷启动恢复，支持流式 thinking / tool_call / usage 结构化事件
• 直接消费 Open Design 自带的 164+ 个功能 skill、40+ 渲染模板、150+ 个 DESIGN.md 品牌系统
• 设计稿走沙箱 iframe 实时预览，可一键导出 HTML / PDF / PPTX / MP4 / ZIP

技术实现

• 语言: TypeScript（Node ~24）
• 关键依赖: @open-design/sidecar、@open-design/contracts、better-sqlite3、sharp、electron
• 架构模式: 本地守护进程 + stdio MCP 服务桥接；DSH 适配器通过严格的 JSONL 协议与官方 dsh --profile open-design --stdio 子进程通信
• 入口文件: plugins/open-design/.mcp.json（stdio MCP 配置） → apps/daemon/src/cli.ts（od CLI 与 MCP 服务实现）

适用场景

想在 DeepSeek Harness（或 Claude Code / Codex / Cursor 等已支持的 Agent）里直接让 AI 产出真实可预览的网页原型、PPT 海报、视频动效，而不是只吐出一段描述性文字的设计师/产品经理。也适合已经在用 Open Design 本地桌面端、想把现有项目无缝接入 dsh 自动化流水线的工作室团队。

前置依赖与兼容性

安装方式

dsh plugin --profile web add github:nexu-io/open-design

配置项

常见问题

Q: 装这个插件一定要装 Open Design 桌面端吗？

A: 不强制装桌面端，但 od 命令必须能在 PATH 里被 dsh 找到。最省事的做法是先装桌面端/源码并启动一次让 od 可用，再在 dsh 里安装这个插件。

Q: 我没装 Claude Code、Codex 这些本地 Agent 怎么办？

A: 不影响。od 会自动检测 PATH 上的 Agent；如果一个都没装，可以在 Open Design 设置里切换到 BYOK 模式，直接把 OpenAI/Anthropic/Azure/Google 等兼容接口的 baseUrl+key 填进去，照样能生成设计稿。

Q: 会不会把我的项目文件上传到云端？

A: 不会。od 默认监听 127.0.0.1，BYOK 代理在守护进程边缘做了 SSRF 防护；只有在显式设置 OD_BIND_HOST 和 OD_ALLOWED_ORIGINS 后才会监听局域网。

Q: DeepSeek API Key 需要在 Open Design 里再填一次吗？

A: 不需要。Key 在 dsh web 的「设置 → 模型 → DeepSeek」里配置并保存；OD 不会读取、也不会回显这个 Key；如果你机器上已经有 DEEPSEEK_API_KEY 环境变量，OD 也直接复用。

Q: 跟 Open Design 自带的 web UI / 桌面端有冲突吗？

A: 没有冲突。od 同时支持 MCP stdio 服务和 HTTP 端口，两者共用同一份 SQLite 项目库，已生成的项目文件对两边都可见。

Q: 卸载会影响我之前生成的项目吗？

A: 不会。dsh plugin --profile web remove nexu-io/open-design 只移除 MCP 桥接，项目文件、设计系统、技能都保留在 Open Design 的数据目录里。

Q: macOS 终端里 od 报错说找不到怎么办？

A: macOS 自带的 /usr/bin/od 是八进制转储工具，会盖住 Open Design 的 od 命令。建议直接通过桌面端「设置 → MCP server」复制那个走绝对路径的客户端片段，不要在终端裸跑 od mcp install <agent>。

上手难度

入门 — 只要本机已装好 Open Design 与 DeepSeek Harness，复制一行安装命令即可在 dsh 中生效；DSH profile 与适配器版本不匹配时会有明确提示并引导安装缺失组件。

已知问题与限制

• DSH 适配器硬绑定 0.1.0-rc.6，其它版本会直接被 versionPolicy.supportedVersions 拦下并要求切换到受支持版本（apps/daemon/src/runtimes/defs/deepseek-harness.ts:56）
• Alpine Linux 不在 DSH 一键安装脚本的自动补齐范围，遇到 Alpine 容器需要手动装 Node + dsh（docs/deepseek-harness-one-click-install.zh-CN.md:32）
• Claude Desktop 的自动 MCP 配置目前仅支持 macOS 与 Windows，Linux 上需要手动写 ~/.config/claude-desktop/open-design.json（README.md:139）
• 首次在 DSH 上启用 Open Design 适配器时，必须经过一次明确确认，Open Design 才会调用 dsh plugin --profile open-design add 把连接组件装进 ~/.dsh/profiles/open-design；如果取消，DSH 不会被选中也不会改 profile（docs/agent-adapters.md:397）
• macOS 终端里裸跑 od mcp install <agent> 可能命中系统 /usr/bin/od 导致安装失败，建议从桌面端「设置 → MCP server」复制带绝对路径的片段（README.md:320）

Open Design: The open-source Claude Design alternative

⚡ Open Design Cloud — the official model service. One recharge to use both agent and image models inside Open Design: GPT, Claude, and DeepSeek for agents; GPT Image 2.0, Seedream 5.0 Pro, and Nano Banana 2.0 for images.

🚀 DeepSeek V4 Flash and V4 Pro are now available. Put top-tier intelligence to work across prototypes, decks, design systems, and everyday agent tasks. Open Design members can use both models without limits for two weeks, directly inside the app.

🧩 DeepSeek Harness is now supported. Connect DeepSeek's official dsh agent harness to Open Design as a native runtime, with structured thinking, tool calls, model discovery, cancellation, and session resume. Generated files stay in the Open Design workflow for live preview and delivery.

Website · Download · Open Design Cloud · Discord · Feishu Chinese Community · Follow @OpenDesignHQ

English · Español · Português · Deutsch · Français · 简体中文 · 繁體中文 · 한국어 · 日本語 · العربية · Русский · Українська · Türkçe · ภาษาไทย

---

What is Open Design

🎨 The open-source Claude Design alternative.  🖥️ Local-first native desktop app for macOS and Windows.  ⚡ Composable skills, brand-grade DESIGN.md design systems, and ready-to-use plugins.  🖼️ Generates web · desktop · mobile prototypes, live dashboards / artifacts, decks, images, video, plus HyperFrames motion graphics. 🔒 Sandboxed iframe preview · HTML / PDF / PPTX / MP4 export.  🤖 Runs on DeepSeek Harness (dsh) · Claude Code · OpenClaw · Codex · Cursor · OpenCode · Qwen · Copilot · Amp · Hermes · Kimi · Antigravity and 26 distinct local CLI executables, or any OpenAI-compatible endpoint via BYOK.

Open Design is what you get when the agent-native loop Anthropic shipped with Claude Design — discover the brief, lock the direction, stream the artifact, critique, deliver — stops being closed and becomes a filesystem of functional skills, rendering design templates, design systems, and plugins that the coding agents already on your laptop can read, write, and remix. Your CLI becomes the design engine, your laptop becomes the studio, and your team's DESIGN.md becomes the brand contract.

It's also the Figma alternative for the agent era — instead of pushing pixels on a canvas, it delivers single-page artifacts in real CSS, real fonts, real components, exported straight to HTML / PDF / PPTX / MP4 — already shaped by your design system, already runnable inside the agent you use every day.

---

Product tour

A quick look at the core Open Design workflow. Start from Home with a brief, explore reusable skills in Plugins, and turn brand references into a Design System. Then enter a project's Studio to create and refine prototypes, decks, mobile apps, images, documents, and HyperFrames in one place.

Core pages

Studio — many artifact types in one project

Inside a project's Studio, the conversation, generated files, and live preview stay together across six artifact types:

---

Platform Compatibility

Open Design connects to mainstream coding agents in two ways: skills, CLI, and MCP for agents that consume OD, plus native runtime adapters for agents that OD launches directly. DeepSeek Harness is a first-class native runtime through the official dsh CLI, with structured streaming, model discovery, cancellation, and session resume.

For DeepSeek Harness, install the official dsh CLI first, then select it in Open Design or run od agent setup deepseek-harness to install/repair OD's connection component. For MCP integrations: od mcp install <agent> --print for a dry-run preview · --uninstall to remove · full list with od mcp install --help.

¹ Automatic MCP configuration for Claude Desktop is currently supported on macOS and Windows only.

No CLI installed? The BYOK proxy at POST /api/proxy/{anthropic,openai,azure,google,ollama,senseaudio}/stream gives you the same loop (no process spawn) — paste baseUrl + apiKey + model, with presets for OpenAI, Atlas Cloud, Anthropic, Azure OpenAI, Google Gemini, Ollama, LM Studio, vLLM, or any OpenAI-compatible endpoint. Atlas Cloud uses https://api.atlascloud.ai/v1 with your own key and OpenAI-compatible model ids such as qwen/qwen3.5-flash. Per-target SSRF protection blocks internal IPs / link-local / CGNAT at the daemon edge.

Runtime definitions live in apps/daemon/src/runtimes/defs/, with registration and shared stream handling under apps/daemon/src/runtimes/. See docs/agent-adapters.md for the adapter contract.

---

Demo

Four core product categories, all rendered by a coding agent running on your laptop. Click a thumbnail to see the real example.

1 · Prototypes — web · desktop · mobile

The default output surface. Single-page HTML artifacts that read your DESIGN.md and render in a sandboxed iframe.

2 · Live artifacts & dashboards

Live dashboards, decision rooms, KPI walls — single-page artifacts that pull data through a tweaks panel and stay editable in place.

3 · Decks — magazine decks, weekly updates, pitches

Every deck exports to HTML (single file, inlined assets), PDF (browser print, deck-aware), PPTX (agent-driven skill), ZIP (archive), or Markdown.

4 · Images — gpt-image-2, ImageRouter, custom API

93 ready-to-replicate prompts live in prompt-templates/ — preview thumbnails, full prompt body, target model, aspect ratio, and source attribution. One click drops a brief into the composer.

5 · Video & HyperFrames — agent-native motion graphics

HyperFrames is HeyGen's open-source, agent-native video framework, integrated as a first-class citizen in Open Design. The agent writes HTML + CSS + GSAP, and HyperFrames renders it to a deterministic MP4 via headless Chrome + FFmpeg. Pair it with Seedance 2.0 for cinematic t2v / i2v, Veo 3 / Sora 2 / Kling 2 for routed model variants, and Suno v5 / Lyria 2 for the audio layer.

11 HyperFrames templates + 39 Seedance prompts ship with the repo. Catalog thumbnails © HeyGen; the framework is Apache-2.0. The OD-specific render workflow (composition cache, sandbox-exec workaround, MP4-as-chip) is detailed in design-templates/hyperframes/.

---

Why Open Design

In April 2026, Anthropic released Claude Design — the first time an LLM stopped writing prose and started delivering design artifacts directly. It went viral. But it stayed closed-source, paid-only, cloud-only, locked to Anthropic's model, Anthropic's skills, Anthropic's surface. No checkout, no self-host, no Vercel deploy, no swap-in-your-own-agent.

Open Design (OD) is the open-source alternative. Same loop, same artifact-first mental model, none of the lock-in:

• 🤖 Agent-native, model-agnostic. We don't ship an agent. The claude / codex / cursor-agent / copilot / hermes / kimi already on your PATH are the design engine. Swap with one click.
• 🧠 Brand-grade by default. Every render reads the active package's DESIGN.md as the core brand contract. 151 design-system packages ship with the repo; legacy packages may be DESIGN.md-only, while newer packages can add manifest.json, tokens.css, components, assets, and provenance. Drop a folder in, the picker finds it.
• 🖥️ Local-first, BYOK at every layer. Native desktop apps for macOS (Apple Silicon + Intel) and Windows (x64). Linux AppImage on the optional release lane. Product analytics and session replay are consent-gated; scrubbed safety and reliability telemetry is always on. Before describing daemon data paths, contributors and operators MUST read AGENTS.md → Daemon data directory contract. This README MUST NOT restate it.
• 🌍 Composable on four planes. Plugins carry runnable workflows · functional skills carry agent behavior · design templates carry rendering blueprints · design systems carry the brand. All four use portable, versionable directories that anyone can author and publish.
• 🔁 Refresh an existing codebase. Hand a git repo + DESIGN.md to the agent and it refactors your real components to the brand spec. Dedicated plugins migrate Figma / Pencil workflows into React / Next.js / Vue code.
• 🔒 Privacy by conviction. Everything runs where your data lives — your laptop, your team's server, your Vercel project. When the network is needed, the BYOK proxy is SSRF-guarded.

Comparison

---

Quick start

🖥️ Download the desktop app (recommended — zero config)

The fastest way to use Open Design. No Node, no pnpm, no clone.

• macOS (Apple Silicon · Intel x64) → open-design.ai or GitHub Releases
• Windows (x64) → open-design.ai or GitHub Releases
• Linux (AppImage, optional lane) → GitHub Releases

After install: the app auto-detects every coding-agent CLI on your PATH, loads 100+ functional skills, the separate rendering-template catalog, and 151 design systems, and lets you type a brief in the entry view.

🤖 Install into your coding agent (no UI)

You can use Open Design without ever opening the GUI — call it as a skill, plugin, or MCP server inside Claude Code, Codex, Cursor, Copilot, OpenClaw, Antigravity, Hermes, Kimi, and more.

If you installed the macOS desktop app via the DMG or Homebrew cask, your shell may still resolve od to Apple's built-in /usr/bin/od octal-dump utility. In that case, open Settings → MCP server in the desktop app and copy the client-specific snippet; it uses absolute paths and does not rely on the bare od command.

# One-line install into the agent you're using:
od mcp install <agent>
# <agent> = claude | codex | reasonix | raven | cursor | copilot | openclaw
#         | antigravity | pi | vibe | hermes | cline | kimi | kiro
#         | trae | opencode

# Hosted equivalent for curl-based setup:
curl -fsSL https://open-design.ai/install.sh | sh -s <agent>

install.sh is a thin shell wrapper around od mcp install; it exists so the hosted URL returns shell instead of the landing-page HTML fallback and fails fast if your shell resolves a non-Open-Design od binary.

macOS / WSL2 users: /usr/bin/od is a system octal-dump command and can shadow Open Design's od command. Desktop-app users should prefer the Settings → MCP server snippet; WSL2 users should follow the WSL2 setup guide first.

Then, inside the agent:

> Use open-design to generate a landing page with the Linear design system

In a filesystem-backed local CLI run, the agent composes the selected functional skill or design template with your DESIGN.md, writes the canonical project files, and Open Design previews those files. A BYOK/plain-API run without filesystem tools instead returns one complete <artifact> block.

🐳 Run with 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
# open http://127.0.0.1:7456

If the browser asks for credentials, use open-design as the username and the OD_API_TOKEN value from deploy/.env as the password. This keeps Docker bridge traffic authenticated without requiring host networking. API clients can keep using Authorization: Bearer <OD_API_TOKEN>.

🚀 Deploy on Sealos

The Sealos App Store template runs the published Open Design Docker image with persistent workspace storage and Basic Auth on the public proxy. For custom public or shared Docker deployments, follow the reverse-proxy and OPEN_DESIGN_ALLOWED_ORIGINS guidance in deploy/README.md.

🧑‍💻 Run from source

git clone https://github.com/nexu-io/open-design.git
cd open-design
corepack enable && pnpm install
pnpm tools-dev run web

Open the URL printed by tools-dev; development ports are allocated dynamically unless you pass explicit port flags.

Node ~24, pnpm 10.33.x. WSL2 users, see docs/wsl-setup.md; native Windows users, see docs/windows-troubleshooting.md. Full quickstart, env vars, Nix flake, and packaged build flow → QUICKSTART.md.

A full workflow — from brief to artifact

brief → plugin → direction → design system → artifact → handoff → memory

1. A PM submits a brief. The plugin picker offers landing page · pitch deck · dashboard · social post · PM spec · OKR scorecard…
2. A designer (or the agent) locks the direction. No brand? Pick from 5 curated directions. Have a brand? Drop a screenshot / URL → the agent connects GitHub, imports Figma, and codifies a reusable DESIGN.md.
3. The agent creates the first deliverable. Plugin + functional skill or design template + DESIGN.md are bound. Filesystem-backed CLI runs write canonical project files and the preview follows them; BYOK/plain-API runs without file tools return one complete <artifact> block.
4. Hand off to engineering. The artifact is real HTML/CSS — drop it into Cursor, Codex, or Claude Code to keep building as code. Or export PPTX / PDF / MP4 straight to marketing.
5. Open Design gets smarter as you use it. Your screenshots, fonts, palettes, and confirmed artifacts accumulate as defaults for the next session. Less rework, less drift.

---

Use Open Design from your coding agent

Open Design ships a stdio MCP server and per-agent install scripts. Any MCP-compatible agent in another repo can read files from your local Open Design projects directly — tokens CSS, JSX components, entry HTML — as a structured API queryable by name. The agent always sees the live file, not a stale export.

# One-line install (16+ CLIs supported):
od mcp install <agent>

# Then the agent can:
od project list --json
od files list <project-id> --json
od files read <project-id> <relative-path>
od plugin list --json
od skills list --json

Why MCP? Exporting and re-attaching a zip every iteration breaks flow. MCP exposes the design source directly — the agent always sees the live file.

For an agent starting from scratch, the installer places ~/.config/<agent>/open-design.json (or the platform equivalent) plus a copy-paste MCP snippet. Cursor gets a one-click deeplink; Claude Code gets a claude mcp add-json one-liner; every other agent gets JSON in the schema its config expects. On macOS desktop installs, prefer that Settings snippet over typing bare od mcp install <agent> in Terminal, because /usr/bin/od may win on PATH. Full per-agent flow → Settings → MCP server in the desktop app, or docs/agent-adapters.md.

Security model. Read-only by default, the daemon binds to 127.0.0.1, and SSRF is blocked at the proxy edge. LAN exposure requires an explicit OD_BIND_HOST plus OD_ALLOWED_ORIGINS. Connector credentials and live-artifact preview routes stay loopback-only regardless.

Internally-hosted model endpoints. To prevent SSRF, the daemon blocks provider base URLs that resolve to private/internal address ranges (RFC1918, link-local, CGNAT, and cloud-metadata IPs) by default, surfacing Internal IPs blocked. If you run an internally-hosted gateway (e.g. LiteLLM or Ollama on a VPN-only 10.x/192.168.x address), opt that host out with OD_ALLOWED_INTERNAL_HOSTS=<host1>,<host2>,... — a comma- or whitespace-separated list of bare hostnames or IPs (10.0.0.5, litellm.internal.corp; a host:port or full URL is accepted and reduced to its hostname; IPv6 must be bracketed, e.g. [fd00::1]). The allowlist is strict opt-in (empty by default), exact-host (no subdomain/substring matching), and applies only to provider endpoints you configure (connection test, model discovery, BYOK chat). It deliberately does not relax the guard on download URLs returned inside upstream responses, which stay blocked. A malformed entry — or CIDR notation, which is not supported — is dropped with a warning rather than silently trusted, so a typo never quietly widens (or fails to widen) the guard. Allowlisting a hostname trusts whatever it resolves to (like OD_ALLOWED_ORIGINS); allowlist the resolved IP instead if you want the DNS-resolved address re-checked.

---

Skills and design templates

100+ functional skills ship in skills/. Each follows the Agent Skills SKILL.md convention and supplies reusable agent behavior, references, or utilities. Renderable starters live separately in design-templates/; they may also use SKILL.md, but they populate the design-template catalog rather than the functional-skill registry.

Two modes anchor the design-template catalog: prototype (web/mobile/desktop single-page artifacts) and deck (horizontal-swipe presentations). Other templates cover image, video, audio, and utility surfaces. The scenario field groups templates by audience: design · marketing · operation · engineering · product · finance · hr · sale · personal.

Full protocol and directory split → docs/skills-protocol.md. Registry endpoints: GET /api/skills for functional skills and GET /api/design-templates for rendering templates.

---

Design Systems

151 brand-grade design-system packages centered on DESIGN.md ship with the repo. Legacy packages may contain only that Markdown contract; newer packages can also carry manifest.json, compiled tokens.css, component fixtures, assets, and provenance evidence. The catalog mixes upstream-derived systems with project-owned additions; design-systems/README.md records the package shape and provenance. Switch a system → the next render uses the new tokens.

Full catalog (click to expand)

AI & LLM — claude · cohere · mistral-ai · minimax · together-ai · replicate · runwayml · elevenlabs · ollama · x-ai

Developer Tools — cursor · vercel · linear-app · framer · expo · clickhouse · mongodb · supabase · hashicorp · posthog · sentry · warp · webflow · sanity · mintlify · lovable · composio · opencode-ai · voltagent

Productivity — notion · figma · miro · airtable · superhuman · intercom · zapier · cal · clay · raycast

Fintech — stripe · coinbase · binance · kraken · mastercard · revolut · wise

E-commerce — shopify · airbnb · uber · nike · starbucks · pinterest

Media — spotify · playstation · wired · theverge · meta

Automotive — tesla · bmw · ferrari · lamborghini · bugatti · renault

Other — apple · ibm · nvidia · vodafone · resend · spacex

Starters — default (Neutral Modern) · warm-editorial

Re-import the library via scripts/sync-design-systems.ts. Add your own brand → drop a DESIGN.md into design-systems/<brand>/. Full guide → design-systems/README.md.

---

Plugins

277 official plugins plus 183 remixable reference examples live in plugins/_official/. Each entry is a portable plugin directory anchored by open-design.json plus the payload required by its type: for example SKILL.md for agent workflows, template.json for media templates, or DESIGN.md for design-system entries. Jump straight to a category:

Also plugins/community/ for community plugins and plugins/registry/ for the publishing flow.

What plugins can do

• 🤖 Run in any coding agent — Claude Code, Codex, Cursor, Copilot, OpenClaw, Antigravity, Hermes, Kimi… through the same skill protocol the agent already knows.
• 🔁 Migrate Figma / Pencil workflows → React, Next.js, or Vue source. See od-figma-migration.
• 🛠️ Refresh an existing codebase to a brand spec — point a plugin at a git repo + DESIGN.md, get a PR. See od-code-migration.
• 💾 Persist custom workflows — your team's reusable templates sit next to the shipped ones.

Using plugins

Plugins are at full parity across the web UI and the od CLI — same /api/plugins endpoints, pick whichever fits.

In the desktop / web app: open the Plugin page to browse the marketplace and click Install; inside a project's Studio, plugins appear as composer chips you click to apply (with the inputs they declare).

On the command line (runs without a UI — this is the path external agents use):

od plugin list                       # list installed plugins (--task-kind / --mode / --tag filters)
od plugin search "landing page"      # search by keyword
od plugin info od-default            # inspect a plugin's metadata, inputs, capabilities
od plugin install od-figma-migration # install from a registry; also accepts ./local-folder or an https://… link
od plugin apply od-default --input brief="a one-page pitch for our seed round"
od plugin upgrade od-default         # upgrade
od plugin uninstall od-default       # uninstall

Every command supports --json, so you can pipe it through jq / xargs into automation.

Building a plugin

An Open Design plugin requires open-design.json plus the payload required by its type. A workflow skill or scenario also includes SKILL.md; manifest-only template and design-system entries use their own payloads instead:

my-plugin/
├── open-design.json    ← required: marketplace metadata + inputs + pipeline + capabilities
├── SKILL.md            ← required for agent-skill/scenario entries; omitted for other plugin types
├── README.md           ← optional: usage, install, registry links
├── preview/            ← optional: index.html / poster.png (strongly recommended for visual plugins)
└── examples/           ← optional: concrete use cases

Core open-design.json fields: specVersion (currently 1.0.0), name (stable ID), version (semver), optional compat.agentSkills[].path (points at ./SKILL.md when the entry exposes an Agent Skill), od.kind (skill / scenario / atom / bundle), od.taskKind (new-generation / figma-migration / code-migration / tune-collab), od.mode (the output surface, e.g. prototype / deck / live-artifact / image / video / hyperframes / audio / design-system / scenario), od.capabilities[] (declare the minimum — a restricted install grants only prompt:inject by default), od.inputs[] (apply-time parameters).

Scaffold + validate locally:

od plugin scaffold --id my-plugin --title "My Plugin"   # generate the skeleton
od plugin validate ./my-plugin                          # check manifest / file layout
pnpm guard && pnpm --filter @open-design/plugin-runtime typecheck

Full field set and runtime contract → plugins/spec/SPEC.md; developing a plugin with a coding agent → plugins/spec/AGENT-DEVELOPMENT.md; copy-paste minimal templates → plugins/spec/examples/.

Contributing a plugin

1. Drop the plugin folder into plugins/community/ (third-party plugins), or — to ship it bundled with Open Design — into the matching tier of plugins/_official/.
2. Pass validation: od plugin validate, pnpm guard, pnpm --filter @open-design/plugin-runtime typecheck.
3. Fill the PR using the template in plugins/spec/CONTRIBUTING.md (ID, version, lane, mode, capabilities, trigger examples; attach a screenshot / preview for visual plugins).
4. To publish to an external registry (skills.sh / ClawHub / standalone GitHub) → plugins/spec/PUBLISHING-REGISTRIES.md.

Plugin registry endpoint: GET /api/plugins. Directory overview → plugins/README.md (简体中文).

---

Architecture

┌────────────────── browser (Next.js 16) / Electron shell ──────────────┐
│  chat · file workspace · iframe preview · settings · import · MCP     │
└──────────────┬─────────────────────────────────────┬─────────────────┘
               │ /api/*                              │
               ▼                                     ▼
   ┌─────────────────────────────────┐   /api/proxy/{provider}/stream (SSE)
   │  local daemon (Express+SQLite)  │   ─→ any OpenAI-compatible BYOK,
   │                                  │       SSRF-guarded at the edge
   │  /api/skills    /api/design-templates    /api/plugins    │
   │  /api/design-systems            │
   │  /api/chat (SSE)   /api/proxy/* │
   │  /api/projects/:id/files/...    │
   │  /api/artifacts/{save,lint}     │
   │  /api/import/claude-design      │
   │  MCP stdio server                │
   └─────────┬───────────────────────┘
             │ spawn(cli, [...], { cwd: managed project cwd })
             ▼
   ┌──────────────────────────────────────────────────────────────────┐
   │  Local runtime definitions come from runtimes/registry.ts;                 │
   │  the base registry has 27 definitions (including byok-opencode),           │
   │  backed by 26 distinct local CLI executables because byok-opencode shares │
   │  the OpenCode executable. See docs/agent-adapters.md.                     │
   │  composes a functional skill or design template + DESIGN.md; writes files │
   └──────────────────────────────────────────────────────────────────┘

Full architecture → docs/architecture.md. Skill protocol → docs/skills-protocol.md. Agent adapter contract → docs/agent-adapters.md.

---

Roadmap

• Daemon + 27 runtime definitions across 26 distinct coding-agent CLI executables + skill/design-template registries + design-system catalog
• Web app + chat + question form + 5-direction picker + todo progress + sandboxed preview
• 100+ functional skills · separate rendering-template catalog · 151 design-system packages · 5 visual directions · 5 device frames
• SQLite-backed projects · conversations · messages · tabs · templates
• Multi-provider BYOK proxy (/api/proxy/{anthropic,openai,azure,google,ollama,senseaudio}/stream) with OpenAI-compatible presets including Atlas Cloud + SSRF guard
• Claude Design ZIP import (/api/import/claude-design)
• Sidecar protocol + Electron desktop + IPC automation
• Artifact lint API + 5-dim self-critique pre-emit gate
• 0.8.0 — plugin marketplace infrastructure (261 official plugins, manifest spec, per-agent install scripts)
• 0.9.0 — Open Design Cloud (official model service built into the app: zero config, one-click sign-in)
• 0.10.0 — the all-in-one design workspace: the whole craft loop in one window (references → material → interactive editing → motion → handoff)
• 0.11.0 — The Bazaar: built in the open — a community marketplace of plugins and design systems anyone can pick from and contribute to
• 0.12.0 — Brand-backed Design System: turn the brand you already own into a reusable, portable DESIGN.md system
• 0.13.0 — Stay in Flow: native session resume, faster model picking, and export straight to screenshot-backed PPTX / PDF
• Packaged Electron builds — macOS (Apple Silicon + Intel) + Windows (x64) + Linux AppImage (optional lane)
• Comment-mode surgical edits — partially shipped; reliable targeted patching in progress
• AI-emitted tweaks panel UX — not yet implemented
• npx od init to scaffold a project with DESIGN.md
• Plugin SDK + od plugin {add,list,remove,test,publish} CLI
• Figma / Pencil → React / Next / Vue migration plugins (alpha)
• Refresh-existing-codebase plugin (point at a git repo + DESIGN.md)

Phased delivery → docs/roadmap.md.

---

Community

Real people behind every channel.

• 💬 Discord — daily chat, plugin sharing, questions → discord.gg/mHAjSMV6gz
• 🐦 X / Twitter — release notes, milestones, behind the scenes → @OpenDesignHQ
• 🗣️ GitHub Discussions — deep Q&A, RFCs, "show your work" → Discussions
• 🐛 GitHub Issues — bug reports, feature requests → Issues

The good-first-issue and help-wanted labels are the easiest way in.

---

Contributing

Open Design keeps moving because contributors — designers, engineers, prompt authors — keep showing up. Many of the most-used skills, design systems, and plugins were written by people outside the core team.

🎯 Where to start (max leverage, min change)

🤖 Contributing as an agent

If you are the agent reading this, the fastest path is:

# 1. Boot locally
git clone https://github.com/nexu-io/open-design.git
cd open-design && corepack enable && pnpm install
pnpm tools-dev run web

# 2. Find a good-first-issue and assign yourself
gh issue list --label "good first issue" --state open --limit 20
gh issue develop <number>   # create a branch and worktree

# 3. Make the change, run the checks
pnpm guard && pnpm typecheck
pnpm --filter @open-design/<package> test

# 4. Open the PR
gh pr create --fill

Full agent-friendly contribution flow, code style, and PR bar → CONTRIBUTING.md (Deutsch · Français · 简体中文 · 日本語 · 한국어 · Português · ภาษาไทย).

🏅 Open Design Fellow program

We're recruiting Open Design Fellows around the world — Fellows shape the product alongside the core team, represent Open Design officially in their region, and grow the community locally, backed by funded support ($1,000 / MR), free LLM credits, and a direct review track. Details → MAINTAINERS.md and the announcement on Discord.

---

Maintainers

They carry a lot of the load — daily maintenance, review, and community support.

Maintainer rules, promotion criteria, and the exit protocol → MAINTAINERS.md (also Deutsch · Français · 简体中文 · 日本語 · 한국어 · Português · ภาษาไทย).

Contributors

Thanks to everyone who has taken part — code, docs, feedback, a sharp issue, a new skill, a new design system.

---

Repository activity

The SVG above is regenerated daily by .github/workflows/metrics.yml using lowlighter/metrics.

---

Star us

If this saved you thirty minutes, give it a ★. Stars don't pay rent — but they tell the next designer, agent, and contributor that this experiment is worth their attention. One click, three seconds, a real signal.

---

References & lineage

Detailed provenance → docs/references.md.

License

Apache-2.0. Bundled skills and templates with their own LICENSE files retain those licenses, including design-templates/guizang-ppt/ (MIT, @op7418), design-templates/html-ppt/ (MIT, @lewislulu), and skills/web-clone/ (MIT, @Jane-xiaoer).