Open Design — Open-Source AI Design Tool for Prototypes and Landing Pages

Introduction

Open Design is an open-source, local-first desktop application that transforms any coding agent into a full design engine. It supports prototyping, landing pages, dashboards, slides, and media generation with export to real file formats including HTML, PDF, PPTX, and MP4. It works with Claude Code, Codex, Cursor, Gemini CLI, and 20+ other agent CLIs via BYOK (Bring Your Own Key).

What Open Design Does

• Generates UI prototypes and landing pages from natural language prompts through your coding agent
• Exports designs to production-ready formats: HTML, PDF, PPTX, MP4, and PNG
• Runs entirely on your local machine with no cloud dependency for design rendering
• Integrates with 20+ coding agent CLIs including Claude Code, Codex, Cursor, and Gemini
• Supports BYOK (Bring Your Own Key) so you use your own LLM API subscriptions

Architecture Overview

Open Design is built as an Electron-based desktop application with a TypeScript frontend. It acts as a bridge between your coding agent and a design rendering pipeline. When you describe a design, the agent generates structured output that Open Design interprets into visual components. The rendering engine handles layout, styling, and export to multiple formats. All processing happens locally, keeping your design data private and your workflow fast.

Self-Hosting & Configuration

• Clone the repository and run npm install followed by npm run dev for development mode
• Build production binaries with npm run build for macOS, Windows, or Linux
• Configure your preferred coding agent by setting the appropriate API key in the settings panel
• Customize export defaults (format, resolution, theme) in the application preferences
• No external server or cloud account required; everything runs on your workstation

Key Features

• Local-first architecture ensures design data never leaves your machine
• Multi-format export pipeline covers web (HTML), print (PDF), presentations (PPTX), and video (MP4)
• Agent-agnostic design works with any OpenAI-compatible or Anthropic-compatible CLI
• Real-time preview updates as the agent iterates on the design
• Open-source under MIT license with an active community contributing templates and components

Comparison with Similar Tools

• Figma — cloud-based, proprietary, subscription pricing; Open Design is local-first and free
• Canva — template-driven consumer tool; Open Design is agent-driven and developer-oriented
• Claude Design — official Anthropic design product; Open Design is the open-source community alternative
• v0 by Vercel — generates UI code from prompts but requires Vercel ecosystem; Open Design is standalone
• Penpot — open-source design tool but manual; Open Design is AI-agent-powered

FAQ

Q: Which coding agents does Open Design support? A: It supports Claude Code, Codex, Cursor, Gemini CLI, OpenCode, and 20+ other agent CLIs via BYOK configuration.

Q: Does Open Design require an internet connection? A: The design rendering and export pipeline runs entirely offline. An internet connection is only needed for the LLM API calls to your chosen agent provider.

Q: What platforms does Open Design run on? A: It provides desktop builds for macOS, Windows, and Linux via Electron.

Q: Is Open Design free to use? A: Yes, the project is MIT-licensed and completely free. You only pay for your own LLM API usage.

Sources

• https://github.com/nexu-io/open-design