Open Design

Open Design is an open-source, agent-oriented design workspace. It turns coding agents you already use — such as Codex, Claude Code, Cursor, Gemini CLI, OpenCode, and more — into complete design engines: simply enter your requirements and choose a design system to generate prototypes, landing pages, data dashboards, presentations, images, videos, and other editable project files, exportable as HTML, PDF, PPTX, or MP4.

Open Design now has built-in support for SiliconFlow. By configuring your SiliconFlow API Key in settings, you can easily access models like DeepSeek, Kimi, GLM, Qwen, and more, choosing the right model capabilities for your design and creative tasks.

Installing Open Design

Desktop App (Recommended)

No need to install Node.js, pnpm, or clone the repository — just download, install, and start creating:

macOS (Apple Silicon / Intel): Download from the Open Design website or GitHub Releases
Windows (x64): Download from the Open Design website or GitHub Releases
Linux (AppImage): Download from GitHub Releases

After installation, Open Design automatically detects installed coding agent CLIs and loads built-in skills and design systems.

Docker Self-Hosted

git clone https://github.com/nexu-io/open-design.git
cd open-design/deploy
cp .env.example .env
echo "OD_API_TOKEN=$(openssl rand -hex 32)" >> .env
docker compose up -d

After launching, visit http://localhost:7456.

Running from Source

git clone https://github.com/nexu-io/open-design.git
cd open-design
corepack enable && pnpm install
pnpm tools-dev run web

This requires Node.js 24+ and pnpm 10.33.x. For more details, see the Open Design Quick Start guide.

Get Your SiliconFlow API Key

Visit SiliconFlow to register or log in.
Go to the API Keys page, create a new API Key, and copy it.

Configure SiliconFlow in Open Design

On the Open Design login page, select "Local Agent" or "Use Your Own Key".

Select OpenAI as the API provider.
Select SiliconFlow(CN) as the provider.

Paste your SiliconFlow API Key.
Confirm the Base URL is:

https://api.siliconflow.cn/v1

Select a model from the dropdown, for example:

deepseek-ai/DeepSeek-V4-Pro

Once configured, Open Design can execute BYOK design tasks through the SiliconFlow API.

Generate Your First Design

Return to the Open Design home page and select "New Project" or "Start Designing".
Choose a skill or design template, such as prototype, slides, etc.
Enter your requirements in the dialog box and start generating. For example:

Create a responsive login page with email, password, and SSO login options, styled in Apple's design language.

Open Design generates design results in real-time within a sandbox preview.
Review the results, then decide whether to accept changes to local files.

You can also continue to:

Iterate within the same project by asking follow-up questions;
Export as HTML, PDF, PPTX, or ZIP;
Hand off the generated HTML/CSS to Cursor, Codex, or Claude Code for further development.

What You Can Do with Open Design

After integrating SiliconFlow, you can use Open Design to create:

Product Prototypes: Landing pages, web apps, mobile interfaces
Presentations: Exportable as PPTX or PDF for proposals and reports
Data Dashboards: Operations analytics panels, KPI dashboards, decision cockpits
Visual Content: Brand images, posters, motion graphics, and video assets

Different models suit different tasks. You can flexibly switch in settings: use lightweight models for quick exploration, and more powerful models for complex pages, long-context design specs, or full project generation.

Model Selection Tips

Design tasks typically require models with strong instruction comprehension, long-context handling, and front-end code generation capabilities, as agents often need to simultaneously read design specs, skill instructions, and project context, then generate complete, runnable deliverables.

Ready to get started? Create your SiliconFlow API Key, configure it in Open Design, and start generating editable, deliverable design works.

Open Design

On this page