Open Source · MIT Licensed

AI-Native Design Tool
Design as Code

Name: OpenPencil
Author: ZSeven

Prompt to UI on canvas. Multi-agent orchestration. Built-in MCP server. Production code generation. Open source.

Download NowStar on GitHub

OpenPencil interface showing AI-powered design generation on canvas

Watch demo video

Features

Everything you need

A complete design toolkit powered by AI, built for the modern developer workflow.

Prompt to Design

Describe your interface in natural language. Watch it materialize on canvas in real-time with streaming generation.

Multi-Agent Support

Connect Claude, Codex, OpenCode, or any MCP-compatible agent. Your design, your choice of AI.

Built-in MCP Server

Automate design from any terminal. Read, create, and modify .op files programmatically via Model Context Protocol.

Figma Import

Import .fig files with full layout, style, and component preservation. Seamless migration from your existing workflow.

Code Generation

Export production-ready code in 8 frameworks: React, Vue, Svelte, HTML, Flutter, SwiftUI, Compose, and React Native.

design.md

Markdown-based design system spec — colors, typography, components, layouts. AI agents follow it for consistent design. Import, export, or auto-generate.

How it works

From idea to code in seconds

Describe
Tell the AI what you need in natural language or attach screenshots as references.
Generate
AI creates your design on canvas. Complex pages are split into parallel sub-tasks.
Export
Export to 8 frameworks including React, Vue, Svelte, Flutter, SwiftUI, and more — ready for production.