Openpencil
The world's first open-source AI-native vector design tool and the first to feature concurrent Agent Teams. Design-as-Code. Turn prompts into UI directly on the live canvas. A modern alternative to Pencil.
Last verified:
What is Openpencil?
OpenPencil is the world's first open-source AI-native vector design tool that transforms natural language prompts into UI designs directly on an infinite canvas. It features multi-agent orchestration where multiple AI agents work concurrently on different sections of a design (hero, features, footer) in parallel with streaming generation. The tool implements a Design-as-Code philosophy where .op files are JSON-based, human-readable, Git-friendly, and diffable, making designs version-controllable like code.
Key features include a built-in MCP server that connects to Claude Code, Codex, Gemini, OpenCode, Kiro, and Copilot CLIs for terminal-based design automation. It supports Figma .fig file import with full layout, style, and component preservation for seamless migration. The tool offers design variables with color, number, and string tokens supporting multi-theme configurations and automatic CSS custom property generation. Code export is coming soon for React + Tailwind CSS, HTML + CSS, Vue, Svelte, Flutter, SwiftUI, Jetpack Compose, and React Native from a single .op file.
OpenPencil is designed for designers and developers who want an open alternative to Figma's closed platform. It runs on macOS, Windows, and Linux as both a web app and native Electron desktop application. The tool includes real-time multiplayer collaboration over peer-to-peer WebRTC without requiring accounts or servers, an AI chat with 87 editor tools, a CLI for terminal control, a Vue SDK for embedding, and a JSX renderer for LLM-friendly UI specification. It is MIT licensed and completely free forever.
Openpencil pricing
Pricing model: Freemium
OpenPencil is completely free forever under the MIT license. There are no paid plans, subscription tiers, or premium features. The tool is open-source and community-driven, with development funded by GitHub Sponsors. All features including multi-agent orchestration, MCP server, Figma import, design variables, CLI, and collaboration are available at no cost. Docker images are available for free from GitHub Container Registry.
Openpencil pros
- MIT licensed and completely free forever
- Open-source with full transparency
- Prompt-to-UI with real-time streaming generation on canvas
- Concurrent Agent Teams work in parallel on different design sections
- Multi-model support: Claude, Codex, OpenCode, Gemini, Copilot, and any MCP-compatible agent
- Built-in MCP server with 90 tools for design automation
- Figma .fig import preserves layout, styles, and components
- .op files are JSON-based, human-readable, and Git-friendly
- Design variables generate CSS custom properties automatically
- Real-time collaboration via peer-to-peer WebRTC without accounts
- CLI tool for terminal control and scripting designs
- Runs on macOS, Windows, and Linux
- Vue SDK and pen-react for embedding in custom applications
- 50+ built-in style guides with tag-based fuzzy matching
- Multi-language interface in 15 languages
- Auto-layout with vertical/horizontal, gap, padding, justify, align
- Boolean operations: union, subtract, intersect
- Git integration with clone, branch, push/pull, and three-way merge
- JSX renderer for LLM-friendly UI specification
- No API keys, no plugins, no waiting list required
Openpencil cons
- Code export marked as coming soon, not fully available yet
- Community UIKit Hub still under development
- AI chat relies on Claude CLI OAuth login for some features
- Requires Bun >= 1.0 and Node.js >= 18 for development setup
- Zig >= 0.14 needed for building agent-native from source
- Docker images with AI CLI require volume persistence for auth sessions
- New project with active development (170 commits, version 0.7.x)
- Some features like collaboration and plugin system on roadmap not yet complete
Frequently asked questions about Openpencil
What is OpenPencil?
OpenPencil is the world's first open-source AI-native vector design tool. It transforms natural language prompts into UI designs on an infinite canvas with multi-agent orchestration, built-in MCP server, and Design-as-Code philosophy using JSON-based .op files.
Is OpenPencil free?
Yes, OpenPencil is MIT licensed and completely free forever. There are no paid plans, subscriptions, or premium tiers. All features are available at no cost, and development is funded by GitHub Sponsors.
What platforms does OpenPencil support?
OpenPencil runs on macOS, Windows, and Linux. It's available as a web app at op.zseven.tech and as a native Electron desktop application with auto-updates from GitHub Releases. Docker images are also available.
Which AI models can I use with OpenPencil?
OpenPencil supports 9+ providers including Anthropic (Claude), OpenAI (GPT-4o), Google (Gemini), DeepSeek, MiniMax, Qwen, Llama, and Mistral. It also connects to Claude Code, Codex CLI, OpenCode, GitHub Copilot CLI, and Gemini CLI via MCP.
How does multi-agent orchestration work?
The orchestrator decomposes complex pages into spatial sub-tasks (hero, features, footer). Multiple AI agents work on different sections simultaneously, streaming in parallel with per-member canvas indicators showing which agent is working on which area.
Can I import Figma designs?
Yes, OpenPencil supports .fig file import with full layout, style, fills, strokes, effects, text, images, and vector preservation. This enables seamless migration from Figma to OpenPencil.
What code export formats are available?
Code export is coming soon and will support React + Tailwind CSS, HTML + CSS, Vue, Svelte, Flutter, SwiftUI, Jetpack Compose, and React Native from a single .op file. Design variables become CSS custom properties automatically.
How does collaboration work?
Real-time multiplayer editing uses peer-to-peer WebRTC with no server or account required. Share a room link to edit together with live cursors and follow mode. Document state syncs via CRDT, so edits merge automatically even on flaky connections.
What is the MCP server used for?
The built-in MCP server exposes 90 tools for reading, creating, and modifying designs from any MCP-compatible client like Claude Code, Cursor, Windsurf, Codex, or Gemini. It runs over stdio or HTTP with session support for terminal-based design automation.
How do I install OpenPencil?
On macOS: brew tap zseven-w/openpencil && brew install --cask openpencil. On Windows: scoop bucket add openpencil && scoop install openpencil. On Linux: download .AppImage or .deb from GitHub Releases. CLI: npm install -g @zseven-w/openpencil. For development: bun install && bun run dev.