โšก OpenDesign Cloud โ€” the official model service. One recharge to use both agent and image models inside OpenDesign: 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. OpenDesign 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 OpenDesign as a native runtime, with structured thinking, tool calls, model discovery, cancellation, and session resume. Generated files stay in the OpenDesign workflow for live preview and delivery.


What is OpenDesign

๐ŸŽจ 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.

OpenDesign 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 OpenDesign 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

OpenDesign 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.

Coding agent / platform ย ย ย ย ย ย ย ย  Status ย ย  Quick setup ย ย ย ย ย ย ย ย ย ย ย ย ย ย ย ย ย ย 
Claude Code โœ… Supported od mcp install claude
Claude Desktop โœ… Supportedยน od mcp install claude-desktop
Codex CLI โœ… Supported od mcp install codex
DeepSeek Reasonix โœ… Supported od mcp install reasonix
DeepSeek Harness โœ… Native runtime od agent setup deepseek-harness
Raven โœ… Supported od mcp install raven
Cursor โœ… Supported od mcp install cursor
VS Code + GitHub Copilot โœ… Supported od mcp install copilot
GitHub Copilot CLI โœ… Supported od mcp install copilot
OpenCode โœ… Supported od mcp install opencode
OpenClaw โœ… Supported od mcp install openclaw
Antigravity โœ… Supported od mcp install antigravity
Cline โœ… Supported od mcp install cline
Trae โœ… Supported od mcp install trae
Kimi CLI โœ… Supported od mcp install kimi
Kiro โœ… Supported od mcp install kiro
Pi Agent โœ… Supported od mcp install pi
Mistral Vibe CLI โœ… Supported od mcp install vibe
Hermes Agent โœ… Supported od mcp install hermes

For DeepSeek Harness, install the official dsh CLI first, then select it in OpenDesign 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 OpenDesign. 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 OpenDesign

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.

OpenDesign (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

Claude Design Figma Lovable / v0 / Bolt OpenDesign
Open source โŒ โŒ โŒ โœ… Apache-2.0
Self-host / desktop โŒ โŒ โŒ โœ… macOS + Windows + Docker + Vercel web
Agent-native (runs in your CLI) Anthropic only โŒ Cloud agent only โœ… 25 CLIs + BYOK
Brand-grade DESIGN.md Proprietary Theme JSON Limited tokens โœ… 151 systems shipped
Skills / plugins / templates Closed Plugin store Closed โœ… 100+ functional skills ยท rendering templates ยท 277 plugins
HyperFrames (HTMLโ†’MP4) โŒ โŒ โŒ โœ… First-class
Refresh an existing repo to brand โŒ โŒ โŒ โœ… via agent + DESIGN.md
Minimum billing Pro / Max / Team Pro / Org Pro / Team BYOK ยท any compatible endpoint

Quick start

๐Ÿ–ฅ๏ธ Download the desktop app (recommended โ€” zero config)

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

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 OpenDesign 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 OpenDesign'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 OpenDesign 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

Deploy on Sealos

The Sealos App Store template runs the published OpenDesign 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, 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. OpenDesign 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 OpenDesign from your coding agent

OpenDesign ships a stdio MCP server and per-agent install scripts. Any MCP-compatible agent in another repo can read files from your local OpenDesign 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][skill] 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.

Design template Mode Scenario What it produces
web-prototype prototype design Default landing page / hero
saas-landing prototype marketing Hero / features / pricing / CTA
dashboard prototype operation Admin / analytics (with sidebar)
mobile-app prototype design iPhone 15 Pro / Pixel framed app
mobile-onboarding prototype design Splash ยท value-prop ยท sign-in flow
social-carousel prototype marketing 3-card 1080ร—1080 carousel
email-marketing prototype marketing Table-fallback-safe brand email
magazine-poster prototype marketing Single-page magazine layout
motion-frames prototype marketing Looping CSS motion hero
sprite-animation prototype marketing 8-bit pixel animated explainer
pm-spec prototype product PM spec doc (with TOC + decision log)
team-okrs prototype product OKR scorecard
eng-runbook prototype engineering Incident runbook
finance-report prototype finance Exec finance summary
hr-onboarding prototype hr Role onboarding plan
guizang-ppt deck marketing Magazine-style web PPT (deck default)
html-ppt-* deck marketing 15 deck templates ร— 36 themes (master template in design-templates/html-ppt/)
hyperframes video marketing HTML โ†’ MP4 motion graphics (HeyGen OSS framework)
critique utility design Five-dimensional self-critique scoresheet
tweaks utility design AI-emitted tweaks-panel manifest

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.

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:

Category Count Contents
scenarios/ 13 Complete design scenarios โ€” od-default, od-design-refine, od-figma-migration, od-code-migration, od-react-export, od-nextjs-export, od-vue-export, od-media-generation, [`od-new-generatio