OpenPencil
The world's first open-source AI-native vector design tool with concurrent Agent Teams, Design-as-Code, built-in MCP Server, and multi-model intelligence.
At a Glance
Fully free and open-source under the MIT License. Free to use, modify, and distribute.
Engagement
Available On
Alternatives
Listed Apr 2026
About OpenPencil
OpenPencil is the world's first open-source AI-native vector design tool, enabling users to turn natural language prompts into UI directly on an infinite canvas in real-time. It features concurrent Agent Teams where an orchestrator decomposes complex pages into spatial sub-tasks handled by multiple AI agents simultaneously. The tool supports Design-as-Code via .op JSON files that are Git-friendly and diffable, with code export to React + Tailwind, HTML + CSS, Vue, Svelte, Flutter, SwiftUI, Jetpack Compose, and React Native. It runs as a web app and native desktop application on macOS, Windows, and Linux via Electron.
- Prompt → Canvas: Describe any UI in natural language and watch it appear on the infinite canvas with streaming animation; modify existing designs by selecting elements and chatting.
- Concurrent Agent Teams: The orchestrator decomposes complex pages into spatial sub-tasks, with multiple AI agents working on different sections simultaneously in parallel.
- Multi-Model Intelligence: Automatically adapts prompts, thinking mode, and timeouts per model tier — supporting Claude, GPT-4o, Gemini, DeepSeek, MiniMax, Qwen, Llama, Mistral, and more.
- Built-in MCP Server: One-click install into Claude Code, Codex, Gemini, OpenCode, Kiro, or Copilot CLIs; design from your terminal by reading, creating, and modifying
.opfiles through any MCP-compatible agent. - Design-as-Code:
.opfiles are JSON — human-readable, Git-friendly, and diffable; design variables generate CSS custom properties for seamless code export. - CLI (
op): Control the design tool from your terminal with commands likeop design,op insert, andop export; supports batch design DSL, node manipulation, and code export. - Multi-Platform Code Export: Export to React + Tailwind, HTML + CSS, Vue, Svelte, Flutter, SwiftUI, Jetpack Compose, and React Native from a single
.opfile. - Figma Import: Import
.figfiles with layout, fills, strokes, effects, text, images, and vectors preserved. - Design System: Design variables with color, number, and string tokens; multi-theme support; component system with instances and overrides; CSS custom properties sync.
- i18n Support: Full interface localization in 15 languages including English, Chinese, Japanese, Korean, French, Spanish, German, Portuguese, Russian, Hindi, and more.
Community Discussions
Be the first to start a conversation about OpenPencil
Share your experience with OpenPencil, ask questions, or help others learn from your insights.
Pricing
Open Source (MIT)
Fully free and open-source under the MIT License. Free to use, modify, and distribute.
- Infinite canvas vector design
- AI-native prompt to UI generation
- Concurrent Agent Teams
- Built-in MCP Server
- Multi-model intelligence
Capabilities
Key Features
- Prompt to UI generation on infinite canvas
- Concurrent Agent Teams for parallel design
- Multi-model intelligence with capability profiles
- Built-in MCP Server with one-click CLI install
- Design-as-Code with .op JSON file format
- CLI tool (op) for terminal control
- Multi-platform code export (React, Vue, Flutter, SwiftUI, etc.)
- Figma .fig file import
- Design variables and tokens with CSS sync
- Component system with instances and overrides
- Multi-theme support
- Boolean operations (union, subtract, intersect)
- Auto-layout system
- Infinite canvas with pan, zoom, and smart alignment
- Multi-page document support
- Docker support with multiple image variants
- 15-language interface localization
- Auto-update from GitHub Releases
- Native desktop app via Electron
- Vision input for reference-based design