Open Design is a free, open-source Claude Design alternative for creating prototypes, decks, dashboards, mobile screens, documents, media assets, and marketing pages with agent-driven workflows.
It can run through Open Design Cloud, a local coding-agent CLI, or a compatible BYOK provider. The desktop app connects the model or agent to skills, Markdown design systems, project files, reference material, and a sandboxed preview.
Each project keeps the brief, reference material, design system, chat history, and rendered artifact together. The active agent works from the selected skill and DESIGN.md, while the sandboxed preview shows the result before export or handoff.
Features
- Built-in AMR agent with the bundled
velaCLI. - Detects Claude Code, Codex, Cursor, Gemini, OpenCode, Qwen, Copilot, Kimi, Pi, Kiro, Aider, Trae, and other CLI agents on PATH.
- Supports Anthropic, OpenAI-compatible, Azure OpenAI, Gemini, Ollama Cloud, and local BYOK providers.
- Uses plugins for design systems, prototypes, exports, Figma-related work, and reusable skill bundles.
- Includes a plugin registry with trust badges, previews, install flows, and marketplace metadata.
- Keeps chat, @mentions, slash commands, code streaming, and an interactive terminal in one project view.
- Captures web references and page screenshots inside the project.
- Stores agent memory across runs and projects.
- Schedules repeatable design, review, and artifact routines.
- Agent skills and plugins for prototypes, decks, documents, dashboards, media, research, browser work, and handoff.
- Reads
DESIGN.md,tokens.css, and component manifests. - Manages skills and design systems from the desktop app.
- Uses a Questions tab to collect brief details before generation.
- Previews artifacts in a sandboxed iframe with staged feedback.
- Accepts queued preview comments, image attachments, notes, and deck markers.
- Combines drawing and screenshot markup in Studio.
- Keeps image, video, and audio assets in one Media tab.
- Exports HTML, PDF, PPTX, ZIP, Markdown, media assets, Cloudflare Pages deployments, and handoff files.
- Creates contained preview URLs and run-scoped MCP bundles for editor or coding-agent handoff.
- Runs an MCP server and connects external MCP servers through daemon-managed OAuth.
- Lets MCP clients work with project files, generation loops, and Codex bootstrap actions.
- Stores local runtime state, artifacts, templates, tabs, and conversations in
.od/.
Use Cases
- Create a magazine-style HTML pitch deck for a seed round by typing a brief, answering the Questions tab prompts, and selecting a visual direction.
- Capture external references in a project board, then use page captures and notes as design context during the session.
- Prototype a three-screen mobile onboarding flow with a mobile skill and device-frame assets.
- Produce a SaaS landing page with hero, feature, pricing, and CTA sections against a Linear, Vercel, Stripe, Apple, or Figma-style design system.
- Build a gamified mobile app prototype across multiple frames for investor demos or early user testing.
- Draft a PM specification document, OKR scoresheet, meeting note, invoice, finance summary, or incident runbook with document skills.
- Use plugins to add reusable project context, inputs, surfaces, and multi-stage artifact workflows.
- Run several asset-gathering or design sessions in parallel while queued comments keep review notes attached to the preview.
- Create responsive handoff files, project export manifests, and contained preview URLs for a coding agent or editor.
- Run scheduled routines for repeatable project maintenance, design review, or status artifacts.
Open Design vs Claude Design
Claude Design and Open Design tackle the same first problem: take a brief, some context, and a design direction, then produce something concrete enough to review. Claude Design does it inside Anthropic’s hosted workspace. You can shape prototypes, slides, one-pagers, landing pages, and product mockups through chat, comments, direct edits, and exports.
Open Design takes the same artifact-first idea and puts the machinery on your side of the fence. Its web app, desktop shell, local daemon, coding-agent adapters, plugins, skills, design systems, device frames, comments, and sandboxed preview all work around files you can inspect and keep. That is a far better deal when the artifact must become part of a live product.
I would pick Open Design for source access, self-hosting, local project files, plugin control, BYOK models, and a design system that sits beside the code. The price is setup work and more decisions about providers, permissions, and deployment. Claude Design wins when your team already pays for Claude and wants the managed route. For a developer-led workflow, I would take the extra control every time.
| Feature | Open Design | Claude Design |
|---|---|---|
| Access model | Free open-source software | Claude subscription feature |
| Source access | Open codebase under Apache-2.0 | Closed product environment |
| Main workflow | Local daemon plus web or desktop app with chat, terminal, reference, and preview surfaces | Hosted Claude design workspace |
| First-run AI option | Open Design AMR inside the desktop flow | Claude inside Anthropic’s product |
| Local agents | Claude Code, Codex CLI, Cursor Agent, Gemini CLI, OpenCode, Qwen Code, Aider, Trae CLI, Antigravity, DeepSeek Reasonix, and more | Not a local agent picker |
| BYOK providers | Anthropic, OpenAI-compatible endpoints, Azure OpenAI, Google Gemini, Ollama Cloud, and local loopback providers | Not the main workflow |
| Self-hosting | Supported | Not supported |
| MCP | Built-in MCP server, run-scoped MCP tool bundles, and external MCP client support | Claude workspace and connector workflow |
| Extensibility | Plugins, skills, design systems, templates, and MCP clients | Claude-native product features and connectors |
| Design systems | DESIGN.md files, tokens.css, component manifests, and in-app management | Team design system setup inside Claude |
| Preview collaboration | Sandboxed preview with queued comments, attachments, pinned deck markers, and staged feedback | Claude canvas collaboration |
| Exports | HTML, PDF, PPTX, ZIP, Markdown, media workflows, Cloudflare Pages, project export manifests, and handoff files | Canva, PDF, PPTX, standalone HTML, and internal sharing |
| Best fit | Developers, open-source users, technical designers, and local-first teams | Teams already using Claude plans |
How to Use Open Design
Download the desktop app
Use the GitHub releases page for packaged builds. Open Design currently publishes macOS Apple Silicon and Intel builds plus Windows x64 builds.
Start with the desktop app and Open Design AMR for the shortest setup path. Sign in, select a model, and create the first artifact. Connect a local agent CLI or API provider after that.
Run from the repository
Use this setup for local web development and then open the URL printed by tools-dev.
git clone https://github.com/nexu-io/open-design.git
cd open-design
corepack enable
corepack pnpm --version
pnpm install
pnpm tools-dev run webRun the desktop shell from the repository
Use this command to start the daemon, web app, and desktop shell in the background.
pnpm tools-devRun with Docker
Use Docker Compose from the deploy folder.
cd deploy
docker compose up -dOpen the app at this local URL.
http://localhost:7456
Run Docker Compose on a server your team controls to keep the workspace private and its storage persistent. Open Design provides deployment paths for AWS CloudFormation, Azure Container Instances, and Alibaba Cloud. Those paths connect to infrastructure your team already operates on those platforms.
Starting a Design Session
- Open the web or desktop interface.
- Choose Open Design AMR, an installed local agent CLI, or a BYOK provider.
- If you use AMR, sign in from the desktop flow and choose an available model.
- If you use a local agent CLI, confirm that the binary is available on your PATH.
- Choose a skill or plugin for the output you need, such as a web prototype, SaaS landing page, dashboard, mobile app, deck, browser task, research decision room, or release notes one-pager.
- Choose a design system such as Linear, Vercel, Stripe, Apple, Cursor, Figma, Claude, BMW M, Slack, Cisco, Webex, Mission Control, WeChat, or Neutral Modern.
- Type a design brief in the chat, use mentions when relevant, and add reference material from the project workspace.
- Answer the Questions tab prompts for audience, surface, scale, tone, brand context, constraints, and plugin inputs when they appear.
- Review the live artifact in the sandboxed preview and watch staged preview feedback while generation runs.
- Use Inspect, manual edit mode, queued preview comments, comment attachments, tweaks, Studio mark tools, or another chat instruction to revise the output.
- Export the artifact as HTML, PDF, PPTX, ZIP, Markdown, media, Cloudflare Pages deployment, project export manifest, or design handoff files.
Adding a Custom Skill
Drop a folder containing SKILL.md and an assets/ subdirectory into the skills/ directory. Restart the daemon if the app does not refresh the skill list automatically. The extended od: frontmatter supports mode, platform, scenario, preview, and design_system fields. The full frontmatter schema is documented in docs/skills-protocol.md.
od templates stores user-saved templates for recurring artifacts with a fixed layout, reference set, or project structure.
The desktop app installs, uninstalls, renames, and pins supported skills and design systems from Settings. Open Design packages reusable workflows as plugins. The plugin drawer and marketplace show their inputs, trust metadata, and publishing details.
Supported AI Coding Agents
Open Design scans your PATH on startup, detects installed agents, and lets you switch the active design engine from the model picker. Open Design AMR is the built-in path. Local agent CLIs keep an existing terminal agent on the project files. The interactive terminal sits beside chat, keeping command output, local files, and terminal context visible during the session.
| Agent | Binary | Transport or parser |
|---|---|---|
| Open Design AMR | vela | ACP stdio agent bundled with the installer |
| Claude Code | claude | claude-stream-json typed events |
| Codex CLI | codex | JSON event stream |
| Devin for Terminal | devin | ACP JSON-RPC |
| Cursor Agent | cursor-agent | JSON event stream |
| Gemini CLI | gemini | JSON event stream |
| OpenCode | opencode | JSON event stream |
| Qwen Code | qwen | Plain output |
| Qoder CLI | qodercli | qoder-stream-json typed events |
| GitHub Copilot CLI | copilot | copilot-stream-json typed events |
| Aider | aider | Agent adapter |
| Trae CLI | trae | ACP adapter |
| Antigravity | varies by installation | Agent adapter |
| DeepSeek Reasonix | varies by installation | ACP adapter |
| Hermes | hermes | ACP JSON-RPC |
| Kimi CLI | kimi | ACP JSON-RPC |
| Pi | pi | Stdio JSON-RPC |
| Kiro CLI | kiro-cli | ACP JSON-RPC |
| Kilo | kilo | ACP JSON-RPC |
| Mistral Vibe CLI | vibe-acp | ACP JSON-RPC |
| DeepSeek TUI | deepseek | Plain output |
| CodeWhale | varies by installation | DeepSeek TUI fallback path |
| BYOK API fallback | n/a | SSE through provider proxy |
The BYOK fallback supports Anthropic, OpenAI-compatible providers, Azure OpenAI, Google Gemini, Ollama Cloud, and local loopback providers. The settings validate API keys and provider drafts before saving, fetch models from the connected account, and record configuration outcomes. The daemon accepts Ollama and LM Studio, then blocks private, link-local, CGNAT, multicast, reserved, and redirected non-loopback targets to reduce SSRF risk.
Available Agent Skills and Plugins
Open Design uses file-based SKILL.md workflows and promotes many reusable workflows into first-class plugins. Use skills for a simple task folder. Use plugins for a visible registry entry, configurable inputs, trust metadata, marketplace packaging, or repeatable multi-stage behavior.
web-prototype: Creates single-page web prototypes, landing pages, hero pages, and marketing artifacts.saas-landing: Creates SaaS marketing pages with hero, feature, pricing, and CTA sections.dashboard: Creates admin, analytics, and operations dashboards.pricing-page: Creates standalone pricing pages and comparison tables.docs-page: Creates three-column documentation layouts.blog-post: Creates editorial long-form pages.mobile-app: Creates framed mobile app screens for iPhone or Pixel-style layouts.mobile-onboarding: Creates multi-screen mobile onboarding flows.gamified-app: Creates three-frame gamified mobile app prototypes.email-marketing: Creates product-launch HTML emails with table-safe structure.social-carousel: Creates 1080 x 1080 social media carousel cards.magazine-poster: Creates magazine-style poster pages.motion-frames: Creates motion-design hero frames with CSS animation.sprite-animation: Creates pixel-style animated explainer slides.dating-web: Creates consumer dating or matchmaking dashboard mockups.digital-eguide: Creates two-spread digital guide layouts.wireframe-sketch: Creates early hand-drawn-style wireframe sketches.critique: Creates a five-dimensional design critique scoresheet.tweaks: Creates an AI-generated tweak panel for adjustable design parameters.guizang-ppt: Creates magazine-style web PPT decks from the bundled guizang PPT skill.simple-deck: Creates minimal horizontal swipe decks.replit-deck: Creates product walkthrough decks with a Replit-style presentation flow.weekly-update: Creates team weekly update decks for progress, blockers, and next steps.pm-spec: Creates product management specification documents with TOC and decision logs.team-okrs: Creates OKR scoresheets.meeting-notes: Creates meeting decision logs.kanban-board: Creates board snapshots.eng-runbook: Creates incident and operations runbooks.finance-report: Creates executive finance summaries.invoice: Creates single-page invoices.hr-onboarding: Creates role onboarding plans.agent-browser: Gives agents a browser-oriented workflow for local preview tasks.release-notes-one-pager: Creates a concise release summary artifact.login-flow: Creates login-flow artifacts tied to the WeChat design system.ib-pitch-book: Creates investment-banking strategic-alternatives pitch books.github-dashboard: Creates GitHub dashboard artifacts.clinical-case-report: Creates clinical case report artifacts.social-media-matrix-tracker: Creates live artifact trackers for social media planning.trading-analysis: Creates live artifact dashboards for trading analysis.otd-operations-brief: Creates operations brief live artifacts.research-decision-room: Creates structured multi-role review artifacts from research prompts.- Reference design contract skill: Records expectations and constraints for reference-led design work.
- Hallmark community skill: Adds another community-maintained workflow to the skill catalog.
- Official GSAP plugin: Adds web animation workflows to the agent loop.
Available DESIGN.md Design Systems
Open Design includes DESIGN.md systems, structured tokens.css files, and component manifests across AI, developer tools, SaaS, fintech, docs, consumer, hardware, media, and automotive styles. The desktop app can rename design systems, pin custom systems, read real swatches from color tables, and connect design-system projects to GitHub.
- AI and LLM systems:
claude,cohere,mistral-ai,minimax,together-ai,replicate,runwayml,elevenlabs,ollama,x-ai,openai, andperplexity. - Developer tool systems:
cursor,vercel,linear-app,framer,expo,clickhouse,mongodb,supabase,hashicorp,posthog,sentry,warp,webflow,sanity,mintlify,lovable,composio,opencode-ai,voltagent, andgithub. - Productivity systems:
notion,figma,miro,airtable,superhuman,intercom,zapier,cal,clay, andraycast. - Fintech systems:
stripe,coinbase,binance,kraken,mastercard,revolut, andwise. - E-commerce systems:
shopify,airbnb,uber,nike,starbucks, andpinterest. - Media systems:
spotify,playstation,wired,theverge,meta, and other editorial or consumer product references. - Automotive systems:
tesla,bmw,ferrari,lamborghini,bugatti, andrenault. - Enterprise and communications systems:
slack,cisco,webex,wechat, andmission-control. - Interface and market systems:
hud,loom,trading-terminal,urdu-modern,default,kami, andwarm-editorial.
Pros
- Apache-2.0 source access.
- Built-in AMR option for a lower-friction first run.
- Single project workspace for chat, interactive terminals, references, comments, and preview review.
- Multiple BYOK provider choices.
- Local coding-agent support.
- Plugin runtime, marketplace surfaces, and plugin authoring tools.
- Detailed skill library.
- Large design-system catalog with token and component work.
- Sandboxed artifact previews.
- Preview comments, attachments, Studio mark tools, and tweaks.
- Queued comments, staged preview feedback, and project export manifests for handoff.
- Cloudflare Pages deployment.
- Responsive handoff exports.
- Local project storage.
Cons
- Advanced local, provider, MCP, and deployment workflows need setup work.
- Platform assets can vary by release and operating system.
- Plugin trust, provider credentials, and MCP permissions need review before you connect sensitive projects.
Alternatives and Related Resources
- Open Design GitHub Repository
- Open Design Releases
- QUICKSTART.md
- Claude Design
- Claude Code Skills Documentation
- 10 Best Agent Skills for Claude Code & AI Workflows
- 7 Best CLI AI Coding Agents
- 7 Best & Open-source Claude Cowork Alternatives
- The Ultimate Claude Code Resource List(Agents, Skills, Plugins, and more)
FAQs
Q: Does Open Design require an Anthropic subscription?
A: No. Open Design can use Open Design AMR, local coding-agent CLIs, and BYOK providers. BYOK options include Anthropic, OpenAI-compatible endpoints, Azure OpenAI, Google Gemini, Ollama Cloud, and local loopback providers.
Q: Is Open Design free?
A: Yes. Open Design is free open-source software under Apache-2.0. Model providers, cloud deployment targets, and connected services can charge separately.
Q: Does Open Design need signup?
A: Local Open Design use does not require an Open Design account. Open Design AMR requires desktop sign-in. External model providers, hosted connectors, cloud deployments, and MCP services use their own accounts.
Q: What is Open Design AMR?
A: Open Design AMR is the built-in AI path. It runs as an ACP stdio agent through the bundled vela CLI and starts from the desktop app without a separate coding-agent CLI.
Q: What changed in Open Design 0.16.1?
A: Open Design 0.16.1 is a focused preview-canvas patch. Run status no longer overlays generated work in the preview. Building, completion, and delivery-recovery status stay in Chat, where you can follow progress or retry a failed delivery.
Q: Can Open Design collect references inside a project?
A: Yes. The reference board includes page capture, which keeps external design references near the active session.
Q: What is a skill in Open Design?
A: A skill is a folder under skills/ that contains a SKILL.md file and optional assets. The skill defines the output format, device target, design system, reference files, and generation rules for an artifact.
Q: What is a plugin in Open Design?
A: A plugin is a reusable extension package for Open Design workflows. Plugins can appear in the drawer or marketplace, expose inputs, carry trust metadata, declare surfaces, and package reusable workflow behavior beyond a simple skill folder.
Q: What are DESIGN.md systems in Open Design?
A: DESIGN.md systems are Markdown files that define colors, typography, spacing, layout, components, motion, voice, brand identity, and anti-patterns for a visual system. Open Design also reads structured tokens and component manifests for design-system work.
Q: Can I add my own design system?
A: Yes. You can add a custom DESIGN.md file to the design systems directory. The desktop app also supports design-system management, including rename and pin actions for your own systems.
Q: Does Open Design keep project data local?
A: Open Design stores runtime state in local project files and SQLite data under .od/. External model calls, AMR sessions, cloud deployments, plugins, MCP connectors, contained preview URLs, and export targets depend on the provider or service you choose.
Q: Can Open Design replace Claude Design?
A: Open Design can replace Claude Design for technical users who want source access, local projects, custom agents, BYOK providers, self-hosting, plugin control, reference capture, interactive terminals, queued comments, and project files near their development environment. Claude Design has the easier route for teams that want a hosted Claude-native product with managed access.
Changelog
- 0.16.1: Fixed the preview canvas so run status stays in Chat and does not overlay generated work. Chat keeps building, completion, and delivery-recovery status.
- 0.9.0: Added Open Design AMR, expanded the agent bench, improved model picking, upgraded plugin discovery, refined comments and Studio tools, and added easier Windows and Linux setup paths.
- 0.8.0: Rebuilt the core around plugins, added packaged auto-update, expanded design-system token work, added CJK font fallback, improved manual editing, and broadened media and provider workflows.
- 0.7.0: Added auto-memory, preview comments, a unified Media tab, responsive design handoff outputs, scheduled routines, and in-app skill and design-system management.










