Open Design

<h1 align="center">Open Design: The open-source Claude Design alternative</h1>

⚡ Open Design Cloud — the official model service. One recharge to use GPT, Claude, Gemini, and DeepSeek inside Open Design: 20+ flagship models, zero config, billed by real token usage. Try Open Design Cloud

🏅 The Open Design Fellow program is now open. If you also believe design should be open — become an Open Design Fellow, shape the product alongside the core team, and help more people take part in defining the future of design. Details → MAINTAINERS.md and Discord.

<p align="center"> <img src="https://repo-assets.open-design.ai/resources/images/hero.png" alt="Open Design hero banner — the headline &quot;The open-source Claude Design alternative&quot; over a classical scene of columns and robed figures on a digital-code backdrop, with stat cards for design systems, plugins, coding agents, and media providers" width="100%" /> </p> <p align="center"> <a href="https://open-design.ai/?utm_source=github&utm_medium=referral&utm_content=readme_website">Website</a> · <a href="https://open-design.ai/?utm_source=github&utm_medium=referral&utm_content=readme_download">Download</a> · <a href="https://open-design.ai/cloud/?utm_source=github&utm_medium=referral&utm_content=readme_cloud">Open Design Cloud</a> · <a href="https://discord.gg/mHAjSMV6gz">Discord</a> · <a href="https://x.com/OpenDesignHQ">Follow @OpenDesignHQ</a> </p> <p align="center"> <a href="https://github.com/nexu-io/open-design/releases"><img alt="release" src="https://img.shields.io/github/v/release/nexu-io/open-design?style=flat&color=blueviolet&label=release&include_prereleases&display_name=tag" /></a> <a href="LICENSE"><img alt="license" src="https://img.shields.io/badge/license-Apache%202.0-blue.svg?style=flat" /></a> <a href="https://discord.gg/mHAjSMV6gz"><img alt="discord" src="https://img.shields.io/discord/1479002485040480266?style=flat&logo=discord&logoColor=white&label=discord&color=5865F2&cacheSeconds=3600" /></a> <a href="QUICKSTART.md"><img alt="quickstart" src="https://img.shields.io/badge/quickstart-3%20commands-green?style=flat" /></a> </p> <p align="center"><b>English</b> · <a href="docs/i18n/README.es.md">Español</a> · <a href="docs/i18n/README.pt-BR.md">Português</a> · <a href="docs/i18n/README.de.md">Deutsch</a> · <a href="docs/i18n/README.fr.md">Français</a> · <a href="docs/i18n/README.zh-CN.md">简体中文</a> · <a href="docs/i18n/README.zh-TW.md">繁體中文</a> · <a href="docs/i18n/README.ko.md">한국어</a> · <a href="docs/i18n/README.ja-JP.md">日本語</a> · <a href="docs/i18n/README.ar.md">العربية</a> · <a href="docs/i18n/README.ru.md">Русский</a> · <a href="docs/i18n/README.uk.md">Українська</a> · <a href="docs/i18n/README.tr.md">Türkçe</a> · <a href="docs/i18n/README.th.md">ภาษาไทย</a></p>

---

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 Claude Code · OpenClaw · Codex · Cursor · OpenCode · Qwen · Copilot · Amp · Hermes · Kimi · Antigravity and 25 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 what Open Design is and what it does. Start from Home, orchestrate repeat workflows with Automation, distill a brand contract in Design System, and extend with Plugins and integrations; inside any project's Studio, the same design system streams out prototypes, live artifacts, HyperFrames, decks, and images.

Core pages

<table> <tr> <td valign="top"> <img src="https://repo-assets.open-design.ai/resources/images/product/home.png" alt="Home page" /><br/> _{<b>Home</b> — the overview entry point. Pick a skill and a design system, type the brief, and kick off everything from one place.} </td> </tr> </table> <table> <tr> <td width="50%" valign="top"> <img src="https://repo-assets.open-design.ai/resources/images/product/automation.png" alt="Automation page" /><br/> _{<b>Automation</b> — orchestrate repetitive design workflows into reusable, schedulable automations.} </td> <td width="50%" valign="top"> <img src="https://repo-assets.open-design.ai/resources/images/product/design-system.png" alt="Design System page" /><br/> _{<b>Design System</b> — distill your team's <code>DESIGN.md</code> into a brand contract that shapes every output.} </td> </tr> <tr> <td width="50%" valign="top"> <img src="https://repo-assets.open-design.ai/resources/images/product/plugin.png" alt="Plugin page" /><br/> _{<b>Plugin</b> — browse, install, and distribute workflow plugins to extend generation on demand.} </td> <td width="50%" valign="top"> <img src="https://repo-assets.open-design.ai/resources/images/product/integrations.png" alt="Integrations page" /><br/> _{<b>Integrations</b> — connect external systems and MCP tools, and use Open Design from any IDE, script, or automation.} </td> </tr> </table>

Studio — many artifact types in one project

Inside a project's Studio, the same design system streams out multiple artifact types:

<table> <tr> <td width="50%" valign="top"> <img src="https://repo-assets.open-design.ai/resources/images/product/studio-prototype.png" alt="Prototype" /><br/> _{<b>Prototype</b> — single-page HTML artifacts that read your design system and render in a sandboxed iframe, previewable instantly and downloadable as source.} </td> <td width="50%" valign="top"> <img src="https://repo-assets.open-design.ai/resources/images/product/studio-hyperframe.png" alt="HyperFrame" /><br/> _{<b>HyperFrame</b> — programmatic motion and animated graphics, rendered to a real MP4 (e.g. 1920×1080 · 30fps).} </td> </tr> <tr> <td width="50%" valign="top"> <img src="https://repo-assets.open-design.ai/resources/images/product/studio-ppt.png" alt="Deck" /><br/> _{<b>Deck</b> — pitch decks you can page through, navigate by keyboard, and export to PPTX / PDF.} </td> <td width="50%" valign="top"> <img src="https://repo-assets.open-design.ai/resources/images/product/studio-image.png" alt="Image" /><br/> _{<b>Image</b> — brand-grade images and visual assets, with high-resolution generation and download.} </td> </tr> </table>

---

Platform Compatibility

Open Design ships as skills, a CLI, and an MCP server that mainstream coding agents consume natively. Once OD is installed, a single od mcp install <agent> wires the MCP server into that agent's config, and you call the same tools from inside any agent.

| Coding agent / platform          | Status    | One-line MCP server install                    | |---|:---:|---| | Claude Code | ✅ Supported | od mcp install claude | | Codex CLI | ✅ Supported | od mcp install codex | | DeepSeek Reasonix | ✅ Supported | od mcp install reasonix | | 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 |

od mcp install <agent> --print for a dry-run preview · --uninstall to remove · full list with od mcp install --help.

<p align="center"> <img src="https://repo-assets.open-design.ai/resources/images/coding-agents.png" alt="The 25 coding-agent CLIs Open Design supports — Claude Code · Codex · OpenCode · Hermes · Ant