nexu-io/open-design
⭐ 35,763 · TypeScript · GitHub Repo
🎨 Local-first, open-source alternative to Anthropic's Claude Design. ⚡ 19 Skills · ✨ 71 brand-grade Design Systems 🖼 Generate web · desktop · mobile prototypes · slides · images · videos · HyperFrames 📦 Sandboxed preview · HTML/PDF/PPTX/MP4 export 🤖 Runs on Claude Code / Codex / Cursor / Gemini / OpenCode / Qwen / Copilot / Hermes / Kimi CLI.
agent-skills ai-agents ai-design byok claude claude-code-for-design claude-design coding-agents
1-Sentence Summary
Open-source, local-first Claude Design alternative that runs on your existing AI coding agents, eliminating vendor lock-in.
🔥 Key Capabilities & USP
- 16 Auto-Detected Coding Agents: Automatically discovers and integrates with Claude Code, Codex, Cursor, Gemini CLI, and 12 other agents on your PATH. Pain point solved: No more configuring separate tools or being locked into a single AI provider—switch agents with one click.
- 31 Composable Design Skills & 129 Design Systems: Generate web, mobile, dashboard, and slide prototypes using brand-grade design systems (Linear, Stripe, Vercel, Apple, etc.). Pain point solved: Eliminates the "blank canvas" problem and ensures production-quality UI consistency without manual theming.
- Multi-Format Media & Export: Creates images (gpt-image-2), videos (Seedance 2.0), and motion graphics (HyperFrames HTML→MP4), then exports to HTML, PDF, PPTX, MP4, ZIP, or Markdown. Pain point solved: One tool replaces your entire prototyping-to-deliverable pipeline.
- BYOK Proxy Fallback: When no CLI agent is available, an OpenAI-compatible proxy normalizes SSE streams from Anthropic, OpenAI, Azure, or Google Gemini. Pain point solved: Zero cloud dependency—you bring your own keys and run everything locally or on your own infrastructure.
- Sandboxed Preview with Live Agent Panel: Renders artifacts in a sandboxed iframe (vendored React 18 + Babel) with real-time visibility into agent todos, tool calls, and interruptible generation. Pain point solved: Debug and iterate on designs without leaving the tool, seeing exactly what the agent is doing.
Technical Architecture
| Component | Technology / Approach |
|---|---|
| Architecture | Web app + local daemon (dual-process) |
| Daemon | Privileged process performing PATH-scan agent detection, delegates to existing CLI agents |
| Web Layer | Next.js, deployable to Vercel or self-hosted |
| Preview Engine | Sandboxed iframe with vendored React 18 + Babel for live rendering |
| Agent Integration | 16 auto-detected coding-agent CLIs; BYOK proxy fallback for OpenAI-compatible APIs |
| Streaming | Streaming-artifact loop with live agent panel (todos, tool calls, interruptible) |
| Prompt System | Senior-designer workflow with deterministic palette libraries and checklist culture |
| Export Pipeline | HTML, PDF, PPTX, MP4, ZIP, Markdown |
| Foundation | Built on huashu-design, guizang-ppt-skill, open-codesign, multica |
Quick Start Guide
# Clone the repository
git clone https://github.com/nexu-io/open-design.git
cd open-design
# Install dependencies
pnpm install
# Run the local daemon (starts both daemon and web interface)
pnpm tools-devPrerequisites: Ensure at least one supported coding-agent CLI (e.g., Claude Code, Codex, Cursor) is installed and available on your system PATH. For full functionality, install pnpm globally (npm install -g pnpm).
Pros, Cons & Use Cases
Pros
- Fully open-source (Apache 2.0) with no vendor lock-in—you own your workflow
- Local-first architecture eliminates cloud dependency and data privacy concerns
- Massive agent compatibility (16 agents) means you use whatever AI you already prefer
- BYOK at every layer—bring your own API keys, models, and infrastructure
- Production-ready exports (HTML, PDF, PPTX, MP4) bridge the gap between prototype and deliverable
- Multi-language README lowers barrier for international teams
Cons
- Requires CLI agents on PATH for full functionality—not a standalone design tool
- BYOK proxy fallback is explicitly less capable than native CLI agent integration
- Relies on external agent CLIs which carry their own costs, limitations, and update cycles
- Steeper learning curve for non-developer designers unfamiliar with CLI tools and package managers
Who should NOT use this?
- Pure no-code designers who expect a fully visual, drag-and-drop interface without any terminal interaction
- Teams without AI agent subscriptions—the tool is free, but the underlying agents (Claude, Codex, etc.) require paid access
- Organizations with strict "no local CLI tools" policies in managed IT environments
- Users seeking a finished, consumer-grade product—this is a developer tool that requires setup and configuration
Ideal Use Cases
- Design engineering teams wanting to integrate AI prototyping into existing agent workflows
- Startups and indie developers needing rapid, multi-format prototyping without Figma or Adobe subscriptions
- "Vibe coding" enthusiasts who iterate through natural language and want design output alongside code
- Privacy-conscious teams that must keep all design data and AI interactions on local machines
- Agency teams producing client deliverables across multiple formats (web, slides, video, PDF) from a single prompt
Community & Activity
With 35,763 stars and active development (last updated May 2026), Open Design has clearly struck a nerve in the AI-agent ecosystem. The project's rapid adoption signals strong community validation—this isn't a niche experiment but a tool that solves a real, widespread pain point. The combination of local-first philosophy, broad agent support, and professional-grade output formats has resonated deeply with developers and designers alike. Given the momentum and the project's Apache 2.0 license, expect continued growth in both features and community contributions.