Open Design
Turn local coding agents and DESIGN.md into exportable design artifacts.
- Source repo
- nexu-io/open-design
- Stars
- ★ 106k
- Last updated
- 1d ago
- License
- Apache-2.0
- Primary language
- TypeScript
- FA score
- 45/100 · Major gaps
At a glance
- How it runs
- Works with
- Universal · cross-platformCodex · Claude Code · OpenAI API · Claude API
- Cost
- Free software; you pay for model usage
- Setup effort
- Medium · a few setup steps
- You'll need
- Typical use
- A product designer needs a SaaS landing page that Codex or Claude Code can generate from the team’s DESIGN.md and hand directly to engineers as HTML/CSS.
- Not a fit if
- Linux desktop users: no prebuilt Linux artifact ships, only run-from-source
- Design teams wanting a shared real-time pixel canvas: it delivers code-based single-page artifacts
- Source review
- 45/100 · Major gaps 1 safety controls not found
What does this agent do, and when should you use it?
Open Design is a local-first design workspace and open-source alternative to Claude Design for macOS and Windows. Its stack combines a Next.js frontend, Electron shell, Express-and-SQLite local daemon, stdio MCP server, and runtime adapters for local coding-agent CLIs. A user selects a skill, design system, or plugin, supplies a brief, and the selected agent writes canonical project files or returns a complete <artifact> block through a BYOK API path. The product previews work in a sandboxed iframe and supports prototypes, live dashboards, decks, images, and HyperFrames-based MP4 motion graphics, with exports including HTML, PDF, PPTX, ZIP, Markdown, and MP4. It fits teams that want brand rules and code-based deliverables in the same workflow; it is not a replacement for a conventional collaborative pixel canvas.
Open Design reads composable content from skills/, design-templates/, design-systems/, and plugins/, using the active DESIGN.md as the brand contract. After od mcp install <agent>, an MCP-compatible agent can query local work through od project list --json, od files list <project-id> --json, od files read <project-id> <relative-path>, od plugin list --json, and od skills list --json. In a filesystem-backed CLI run, it composes a functional skill or design template with DESIGN.md and writes canonical files in a managed project working directory; a BYOK/plain-API run without file tools returns one complete <artifact> block through /api/proxy/{anthropic,openai,azure,google,ollama,senseaudio}/stream. The daemon also exposes /api/skills, /api/design-templates, /api/plugins, /api/design-systems, /api/chat, artifact save/lint routes, and Claude Design ZIP import. Generated content is previewed in a sandboxed srcdoc iframe and can be delivered as HTML, PDF, PPTX, ZIP, Markdown, or HyperFrames MP4.
- A product designer needs a SaaS landing page that Codex or Claude Code can generate from the team’s DESIGN.md and hand directly to engineers as HTML/CSS.
- An operations lead needs an editable KPI wall or decision-room briefing generated as a single-page live artifact with a tweaks manifest.
- A marketing team needs a pitch or weekly-update deck that can be reviewed in the browser and exported to PPTX or PDF.
- A design-systems owner wants to package DESIGN.md, tokens.css, components, assets, and provenance into a reusable system for subsequent renders.
- An engineering team using an internal LiteLLM or Ollama gateway wants a BYOK path and can explicitly allow its internal host with OD_ALLOWED_INTERNAL_HOSTS.
How do you install or deploy this agent?
For the desktop app, the README lists macOS (Apple Silicon and Intel) and Windows x64 downloads; Linux AppImage is an optional release lane. To 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. The documented development runtime is Node.js ~24 and pnpm 10.33.x. For Docker, enter deploy, run cp .env.example .env, add OD_API_TOKEN=$(openssl rand -hex 32) to .env, then run docker compose up -d and open http://localhost:7456. BYOK requires the selected provider’s baseUrl, apiKey, and model; local CLI use requires a supported coding-agent executable on PATH and its own authentication.
How do you use this agent?
Run od mcp install codex or od mcp install claude after Open Design is installed; use od mcp install <agent> --print to inspect the generated setup first. Then ask the configured agent something like: Use open-design to generate a landing page with the Linear design system. For headless use, run od plugin list, od plugin search "landing page", od plugin info od-default, or od plugin apply od-default --input brief="a one-page pitch for our seed round". On macOS, if od resolves to the system /usr/bin/od utility, use the absolute-path client snippet from the desktop app’s Settings → MCP server instead of the bare command.
What are this agent's strengths and limitations?
- It offers desktop, web/Docker, CLI, and stdio MCP entry points, so the same system can be used in Studio or from supported coding agents such as Codex and Claude Code.
- Functional skills, renderable templates, plugins, and DESIGN.md-centred design systems are separate portable directories, allowing reusable brand constraints and workflows.
- Filesystem-backed runs write real project files that can be sandbox-previewed and exported as HTML, PDF, PPTX, ZIP, Markdown, or MP4 instead of producing only images.
- The documented runtime registry covers 25 distinct local CLI executables and the BYOK proxy supports Anthropic, OpenAI, Azure, Google, Ollama, and compatible endpoints.
- Source development requires Node.js ~24 and pnpm 10.33.x; Docker deployment additionally requires a token, container environment, and network configuration.
- Generation quality, available models, and authentication depend on either an installed external coding-agent CLI or the user’s own BYOK endpoint and API credentials.
- Direct desktop support is documented for macOS and Windows x64; Linux AppImage is optional, while WSL2 and native Windows have separate troubleshooting guidance.
- The daemon binds to 127.0.0.1 by default. LAN access requires explicit OD_BIND_HOST and OD_ALLOWED_ORIGINS configuration, and internal provider hosts require careful OD_ALLOWED_INTERNAL_HOSTS configuration.
How does this agent compare with similar options?
The repository positions Open Design as an open-source alternative to Claude Design, emphasizing replaceable local coding agents, BYOK, DESIGN.md design systems, and self-hosted or desktop operation. Compared with Figma, its workflow is agent-generated, code-based single-page artifacts rather than a pixel-editing canvas. The README also contrasts it with Lovable, v0, and Bolt on local CLI support, templates, and design-system composition, though the resulting experience remains dependent on the selected model and agent.
Key facts side by side with the most closely related agents.
| Agent | Source review | Form / cost | Stars | Updated | Language | Full support on |
|---|---|---|---|---|---|---|
| Open Design This agent | 45 · Major gaps | Desktop appFree + model costs | ★ 106k | 1d ago | TypeScript | Codex · Claude Code · OpenAI API · Claude API |
| UIZZE · Better UI for Coding Agents | 47 · Major gaps | Agent plugin / skillFreemium | ★ 85 | 6d ago | JavaScript | Codex · Claude Code |
| DESIGN.md Specification | 80 · Good | CLIFree | ★ 29k | 20d ago | TypeScript | — |
| UI Craft | 77 · Good | CLIFree | ★ 432 | today | Go | Codex · Claude Code |
How does FollowAgents rate this agent?
Why each dimension lost points
Evidence shows: README claims local-first, BYOK, SSRF protection, but lacks implementation details; test files show ACP session params do not request global MCP config mutation by default, indicating least privilege; user confirmation: README mentions product analytics and session replay are consent-gated, but no mechanism details; data flow transparency: README mentions telemetry always on, but no specifics; sensitive data handling: no explicit mention; dependency security: package.json has overrides and onlyBuiltDependencies, showing control; external effects: README mentions exports, but no permission details; rollback: not mentioned; source attribution: README mentions bundling third-party skills with original license, but no details. Deductions: most trust criteria are asserted without implementation evidence, rollback completely absent.
Evidence shows: test files demonstrate ACP protocol handling including timeouts, model normalization, message deltas, indicating good internal consistency; dependency availability: package.json specifies pnpm and Node versions, but no lockfile evidence; failure messages: tests check timeout error messages, but no user-facing failure handling. Deductions: dependency availability lacks lockfile evidence, failure messages only internal tests.
Evidence shows: README lists many supported coding agents and platforms, indicating broad audience; capability boundaries: README describes multiple output types, but no explicit limits; trigger precision: MCP install commands are clear, but no detailed trigger conditions; environment fit: supports macOS, Windows, Linux, and mentions Docker and Vercel. Deductions: capability boundaries and trigger precision lack detailed documentation.
Evidence shows: README structure is clear with product intro, quick start, platform compatibility; install notes detailed with desktop and CLI options; naming stability: version exists, but no naming conventions; examples and FAQ: README provides many examples and screenshots, but no FAQ; known limitations: not explicitly listed; license: Apache-2.0, complete; versioning changelog: no CHANGELOG; maintenance responsibility: README mentions MAINTAINERS.md, but no content. Deductions: missing FAQ, known limitations, CHANGELOG, and clear maintenance responsibility.
Evidence shows: output usability: README describes multiple export formats and preview; marginal value: as open-source alternative, offers unique features; cost benefit: BYOK may reduce cost, but no specific analysis. Deductions: cost benefit lacks concrete data.
Evidence shows: README claims have screenshots and links, but no verifiable test results; cross-source corroboration: no third-party verification; fact-inference separation: README mixes facts and marketing language. Deductions: lack of verifiable test results and third-party verification.
- Not found in source: rollback or recovery pathBack up first, or work on a git branch or snapshot, so its changes can be undone.
- Publisher identity is unverified; proceed with caution.
- Many claims in README (e.g., privacy, security) lack implementation details; review code before deployment.
- No rollback mechanism provided, may affect production use.
- No lockfile provided, may affect reproducibility.
Recent releases
Latest entries from the project's GitHub Releases. Notes are quoted from upstream as written, not rewritten or tested by FollowAgents.
-
open-design-v0.27.0 Open Design 0.27.0 — CoRouter for Teams
Release notes excerpt
🌟 Codename: *CoRouter for Teams* Unlimited seats. Shared credits. One subscription gives your team shared access to model credits. Invite colleagues to your workspace for free, with no extra seat fees. Create in Open Design or call models through the API using the same shared credits. The workspace owner manages the subscription, upgrades and top-ups. 🔥 Highlights …View on GitHub ↗ -
open-design-v0.26.1 Open Design 0.26.1 — Intelligent Router
Release notes excerpt
English Meet Skill Discovery: describe what you want to create, and Open Design finds the relevant Skills to guide the work—from your first idea to the next revision. Your idea should be the starting point. In 0.26.1, Skill Discovery helps Open Design understand the kind of work you want to make and choose the Skills that fit. You can focus on the result, with less manual setup before creating and more continuity as you refine it. Alongside this, smoother project starts, connected feedback, and steadier previews keep your work moving. 📥 Download / 下载 …View on GitHub ↗ -
open-design-v0.26.0 Open Design 0.26.0 — Share, Review, Refine
Release notes excerpt
🌟 Codename: *Share, Review, Refine* 🔗 The work can leave the project—and the feedback can find its way home. Share an interactive design or motion video with the people who need to review it; let them watch, try it, and comment in context. Then choose the feedback that matters, send it to an Agent, and keep the review connected to the next round of making. 🔥 Highlights …View on GitHub ↗