The world's first open-source AI-native vector design tool.
_{Concurrent Agent Teams • Design-as-Code • Built-in MCP Server • Multi-model Intelligence}

English · 简体中文 · 繁體中文 · 日本語 · 한국어 · Français · Español · Deutsch · Português · Русский · हिन्दी · Türkçe · ไทย · Tiếng Việt · Bahasa Indonesia

_{Click the image to watch the demo video}

Note: There is another open-source project with the same name — OpenPencil, focused on Figma-compatible visual design with real-time collaboration. This project focuses on AI-native design-to-code workflows.

macOS (Homebrew):

brew tap zseven-w/openpencil
brew install --cask openpencil

Windows (Scoop):

scoop bucket add openpencil https://github.com/zseven-w/scoop-openpencil
scoop install openpencil

Linux / Windows direct download: GitHub Releases — .exe (Windows), .AppImage / .deb (Linux)

CLI (op):

brew install zseven-w/openpencil/op

Or use the install script (macOS / Linux):

curl -fsSL https://raw.githubusercontent.com/ZSeven-W/openpencil/main/scripts/install-op.sh | bash

To allow the newest pre-release:

curl -fsSL https://raw.githubusercontent.com/ZSeven-W/openpencil/main/scripts/install-op.sh | OP_PRERELEASE=1 bash

Windows PowerShell:

irm https://raw.githubusercontent.com/ZSeven-W/openpencil/main/scripts/install-op.ps1 | iex

To allow the newest pre-release:

$env:OP_PRERELEASE = "1"; irm https://raw.githubusercontent.com/ZSeven-W/openpencil/main/scripts/install-op.ps1 | iex

git clone --recurse-submodules https://github.com/ZSeven-W/openpencil.git
# Or already cloned — sync first so stale submodule URLs pick up .gitmodules changes:
git submodule sync --recursive && git submodule update --init --recursive

Three submodules live under vendor/, all public and fetched over HTTPS (no SSH key needed): jian (GPU-Skia UI framework — widgets/render/events), casement (winit fork), and agent (agent-rs — cross-product Rust agent runtime, shared by OP + Zode). vendor/anthropic-agent-sdk is tracked in-tree, not a submodule.

# Web dev server (builds the CanvasKit wasm bundle, then runs the headless web host)
bash scripts/start-web-rust.sh

Browser-entered built-in provider, image-generation, and Openverse credentials are kept in same-origin localStorage (openpencil-rust-web-credentials) by default, separate from ordinary web preferences. A credential needed by an AI request is sent with that request, but the daemon does not write the browser snapshot to settings.json.

Private deployments can opt into server persistence with OPENPENCIL_PERSIST_WEB_CREDENTIALS_SERVER=true. This setting is deployment-wide; each accepted browser snapshot replaces the shared browser-owned copy. Enable it only for a trusted, access-controlled deployment with one active administrator profile, behind HTTPS. Turning the setting off removes previously persisted browser-owned credentials at the next startup while preserving operator-owned configuration. As with all localStorage, same-origin scripts can read these values, so the web origin must be protected from untrusted scripts and XSS. Before downgrading to a release that predates this switch, turn it off and start the current release once to scrub the browser-owned copy.

The web host supports built-in API-key agents only. CLI and ACP agents remain native-only: they are not shown in the web model picker, stored in browser credential snapshots, synchronized to the server, or exposed through web connect routes. Browser requests to credential and AI endpoints allow loopback/localhost origins by default. A public reverse proxy must separately set OPENPENCIL_WEB_ALLOWED_ORIGINS to a comma-separated list of exact origins, for example https://demo.openpencil.dev.

Server persistence does not permit browser-controlled requests to loopback, private, link-local, metadata, or reserved provider endpoints. A trusted private deployment that intentionally uses an internal provider must separately set OPENPENCIL_WEB_AI_ENDPOINT_ALLOWLIST to a comma-separated list of exact URL origins, for example http://127.0.0.1:11434,https://llm.internal.example.

Or run as a desktop app:

cargo run -p op-host-desktop

Prerequisites: Rust (stable) to build the product. Bun >= 1.0 and Node.js >= 18 are only needed for the web SDK under packages/.

Tagged Rust releases publish a single web-host image. The retired TypeScript images with bundled AI CLIs are no longer published.

The web UI exposes built-in agent profiles only; Claude/Codex/OpenCode/Copilot CLI tooling is not bundled into Docker images.

Run:

VERSION="$(scripts/workspace-version.sh)"
docker run -d -p 3100:3100 "ghcr.io/zseven-w/openpencil-web:v${VERSION}"

Then open http://localhost:3100/.

Build locally:

docker build -f Dockerfile.web-rust -t openpencil-web-rust .
docker run -p 3100:3100 openpencil-web-rust

Prompt to UI

• Text-to-design — describe a page, get it generated on canvas in real-time with SSE streaming animation
• Orchestrator — decomposes complex pages into spatial sub-tasks for parallel generation
• Agent Teams — concurrent team members with delegate tool, per-member canvas indicators, and fallback strategies
• Design modification — select elements, then describe changes in natural language
• Vision input — attach screenshots or mockups for reference-based design
• Style Guides — apply visual styles (glassmorphism, brutalist, retro, etc.) via tag-based fuzzy matching
• Anti-slop — cross-generation diversity tracking to avoid repetitive AI output

Multi-Agent Support

Model Capability Profiles — automatically adapts prompts, thinking mode, and timeouts per model tier. Full-tier models (Claude) get complete prompts; standard-tier (GPT-4o, Gemini, DeepSeek) disable thinking; basic-tier (MiniMax, Qwen, Llama, Mistral) get simplified nested-JSON prompts for maximum reliability.

i18n — Full interface localization in 15 languages: English, 简体中文, 繁體中文, 日本語, 한국어, Français, Español, Deutsch, Português, Русский, हिन्दी, Türkçe, ไทย, Tiếng Việt, Bahasa Indonesia.

MCP Server

• Built-in MCP server (op-mcp crate) — one-click install into Claude Code / Codex / OpenCode / Kiro / Copilot CLIs
• No Node.js required — stdio transport via the desktop binary (--mcp <path>), plus a live HTTP endpoint (127.0.0.1:<port>/mcp) from the running app
• Design automation from terminal: read, create, and modify .op files via any MCP-compatible agent
• Layered design workflow — design_skeleton → design_content → design_refine for higher-fidelity multi-section designs
• Segmented prompt retrieval — load only the design knowledge you need (schema, layout, roles, icons, planning, etc.)
• Style guide tools — get_style_guide_tags and get_style_guide for applying visual styles via MCP
• Multi-page support — create, rename, reorder, and duplicate pages via MCP tools

Code Generation

• React + Tailwind CSS, HTML + CSS, CSS Variables
• Vue, Svelte, Flutter, SwiftUI, Jetpack Compose, React Native

Install via Homebrew or the install script, then control the design tool from your terminal:

brew install zseven-w/openpencil/op

curl -fsSL https://raw.githubusercontent.com/ZSeven-W/openpencil/main/scripts/install-op.sh | bash

curl -fsSL https://raw.githubusercontent.com/ZSeven-W/openpencil/main/scripts/install-op.sh | OP_PRERELEASE=1 bash

irm https://raw.githubusercontent.com/ZSeven-W/openpencil/main/scripts/install-op.ps1 | iex

$env:OP_PRERELEASE = "1"; irm https://raw.githubusercontent.com/ZSeven-W/openpencil/main/scripts/install-op.ps1 | iex

op start                     # Launch desktop app
op start --headless --file design.op # Launch headless file-backed server
op design @landing.txt       # Batch design from file
op design @ui.js             # Sandboxed JavaScript with loops
op insert '{"type":"rectangle"}' # Insert a node
op import:figma design.fig   # Import Figma file
cat design.dsl | op design - # Pipe from stdin

Supports three input methods: inline string, @filepath (read from file), or - (read from stdin). Works with the desktop app, web server, or headless file-backed server. See the CLI command reference for all commands.

LLM Skill — install the OpenPencil Skill plugin to teach AI agents how to design with op. Run op install for detected agents, or target one explicitly with op install --target codex.

Canvas & Drawing

• Infinite canvas with pan, zoom, smart alignment guides, and snapping
• Rectangle, Ellipse, Line, Polygon, Pen (Bezier), Frame, Text
• Boolean operations — union, subtract, intersect with contextual toolbar
• Icon picker (Iconify) and image import (PNG/JPEG/SVG/WebP/GIF)
• Auto-layout — vertical/horizontal with gap, padding, justify, align
• Multi-page documents with tab navigation

Design System

• Design variables — color, number, string tokens with $variable references
• Multi-theme support — multiple axes, each with variants (Light/Dark, Compact/Comfortable)
• Component system — reusable components with instances and overrides
• CSS sync — auto-generated custom properties, var(--name) in code output
• Reusable UIKits — import/export component kits from .pen files

AI & Agents

• Prompt-to-canvas with streaming generation and orchestrator-driven spatial decomposition
• Concurrent Agent Teams — multiple designers work on different sections in parallel with per-member canvas indicators
• Layered workflow — design_skeleton → design_content → design_refine with focused prompts per phase
• Style Guides — 50+ built-in styles (glassmorphism, brutalist, retro, etc.) with tag-based fuzzy matching, wired into planning and generation
• Multi-model capability profiles — auto-adapts thinking mode, effort, and prompt shape per model tier
• Built-in Rust agent runtime + Anthropic, Claude Agent SDK, OpenCode, Codex, Copilot, Google Gemini API providers
• Anthropic-format passthrough for Chinese LLM providers — Kimi, Zhipu, GLM, DouBao, Ark, Bailian/DashScope, ModelScope, Coding Plans

Git Integration

• Clone wizard with SSH / HTTPS auth and SSH key management
• Branch picker — create, switch, delete, merge, all from the git panel
• Pull / push cascades with auth retry and non-fast-forward handling
• Folder-mode three-way merge with on-disk MERGE_HEAD state tracking
• Conflict panel with per-node / per-field three-way cards, inline JSON editor, bulk actions, and inline diff block
• Remote settings and SSH keys UI; 15-locale i18n across the whole Git surface

Export

• Canvas export — PNG, JPEG, WEBP, PDF (Cmd+Shift+P)
• Code export — React + Tailwind, HTML + CSS, Vue, Svelte, Flutter, SwiftUI, Jetpack Compose, React Native
• Incremental MCP codegen pipeline — codegen_plan, codegen_submit_chunk, codegen_assemble, codegen_clean

Figma Import

• Import .fig files with layout, fills, strokes, effects, text, images, and vectors preserved

Desktop App

• Native macOS, Windows, and Linux — a single self-contained binary (winit + GPU Skia, no Electron)
• .op file association — double-click to open, single-instance lock
• Background update check against GitHub Releases
• Native application menu with Save As, Open Recent, and an unsaved-changes dialog on close
• Recent files persistence

OpenPencil is part of a family of pure-Rust, AI-native tools from ZSeven-W. They compose: jian renders OpenPencil, agent-rs runs its agents, noema remembers, and zode designs from the terminal.

Project	What it is
Zode	Open-source, AI-native coding assistant for your terminal — a fast Rust TUI (ratatui) that reads your code, runs commands, searches files, and manages git. Drives OpenPencil over MCP.
agent-rs	A pure-Rust async runtime for shipping LLM agents — multi-provider, tool-capable end-to-end, structured permissions, real MCP, zero unsafe. Powers OpenPencil's built-in agent runtime (vendor/agent) and Zode.
jian	Pure-Rust, GPU-Skia UI framework — widgets, layout, events, and hot reload in one stack. Turns a declarative .op document into a native, AI-controllable app with no JS runtime, no DOM, no Electron. OpenPencil's UI framework (vendor/jian).
noema	Local-first, non-vector memory system for coding agents. Durable memory as inspectable files, a review queue for new entries, and lexical (embedding-free) recall — works across Zode, Codex, Claude Code, and MCP runtimes.

OpenPencil was rewritten from the ground up in Rust (#129). The rewrite is complete — the TypeScript + Electron editor was retired at v0.7.5, and the Rust workspace in this repo is the product: one native core that is dramatically smaller and faster, and runs on more platforms from a single codebase.

Measured improvements

• Tiny footprint — the whole desktop app is one 55.5 MB native binary instead of a bundled browser engine plus a Node runtime. The web build is 8.2 MB raw / 2.18 MB gzip after splitting the icon catalog (−48% over the wire).
• Scales to large documents — a 10,000-node live canvas (nested auto-layout, four levels deep) writes, reads, and snapshots layout with no panics and ~0% idle CPU; a full layout snapshot of all 10k nodes returns in ~0.68 s.
• Fast interaction — pan/zoom no longer re-serializes the document every frame (a single hot-path fix cut wheel-zoom CPU from ~69% to ~0%); drags patch the scene incrementally, text measurement is cached, and repaints coalesce to one per frame.
• One core, every screen — the same editor state and the same render backend compile to native desktop, mobile, and the browser via WASM — no parallel reimplementations to keep in sync.
• GPU Skia everywhere — native renders through skia-safe on a GL context; the browser renders through CanvasKit on WebGL2 — the same drawing code, the same output.
• Native accessibility — AccessKit on macOS, Windows, and Linux, plus a DOM mirror on web, instead of leaning on a browser's a11y tree.
• One type-checked workspace — the MCP host, CLI, AI providers, code generation, Figma import, and Git integration all live in a single Rust workspace, with cargo-deny supply-chain gating in CI.

Status: the TypeScript editor was retired at v0.7.5 and lives only in git history; this repository is the Rust workspace. The Rust product is under active development (see the Roadmap below).

openpencil/
├── crates/                   Rust workspace — the product
│   ├── op-editor-core/       Canonical `.op` (PenDocument) editor state + EditorCommand + design variables
│   ├── op-editor-ui/         Platform-free widgets + RenderBackend facade (wasm32-clean)
│   ├── op-editor-host-core/  Transport-free host state machines shared by all hosts
│   ├── op-host-native/       Native host lib — winit + skia-safe GL (desktop + mobile)
│   ├── op-host-web/          Browser bundle — wasm32 cdylib, CanvasKit renderer
│   ├── op-host-desktop/      Desktop binary `openpencil-desktop`; also the `--serve-web` daemon
│   ├── op-host-services/     Headless serve-web / MCP daemon lib
│   ├── op-host-web-server/   Thin GL-free web-server binary
│   ├── op-cli/               CLI tool — `op` command
│   ├── op-mcp/               MCP server — tools, batch design, layered workflow
│   ├── op-ai/                AI providers, chat runtime, streaming
│   ├── op-ai-skills/         AI prompt skill engine (phase-driven prompt loading)
│   ├── op-orchestrator/      Concurrent agent-team orchestration
│   ├── op-codegen/           Code generators (React, HTML, Vue, Flutter, ...)
│   ├── op-figma/             Figma .fig file parser and converter
│   ├── op-git/               Git integration — clone, branch, push/pull, merge
│   └── ...                   op-opmerge / op-pen-loader / op-design-lint / op-i18n /
│                             op-config-store / op-process-io / op-acp / op-smoke / ...
├── packages/                 Web SDK workspace (Bun)
│   ├── op-web-sdk/           Read-only `.op` web viewer SDK (wraps the wasm bundle)
│   ├── op-web-sdk-react/     React 19 adapter
│   └── op-web-sdk-vue/       Vue 3 adapter
├── vendor/                   Vendored subsystems (git submodules)
│   ├── jian/                 GPU-Skia UI framework — widgets/render/events
│   ├── casement/             winit fork
│   └── agent/                Cross-product Rust agent runtime (agent-rs)
└── .githooks/                Pre-commit version drift check

# Product (Rust — run from the repo root)
cargo build --workspace              # Build all crates (add --release for prod)
cargo test --workspace               # Run all tests
cargo check --workspace              # Type check
cargo clippy --workspace --all-targets -- -D warnings   # Lint
cargo fmt --all                      # Format
bash scripts/start-web-rust.sh       # Web dev server (wasm bundle + headless host)
cargo run -p op-host-desktop         # Desktop app (binary: openpencil-desktop)
cargo run -p op-cli -- <args>        # CLI (binary: op)

# Web SDK / JS tooling (run from packages/)
cd packages && bun run lint          # Lint the web SDK (oxlint); also: bun run format
cd packages && bun run generate-iconify-catalog   # Regenerate the Rust icon catalog assets

# Version synchronization (run from repository root)
scripts/sync-version.sh                            # Sync all managed versions from root Cargo.toml
tools/check-version-sync.sh                        # Verify all managed versions match root Cargo.toml

The Rust-ification is complete — the Rust workspace is the product. Kickoff spec: openpencil-docs/superpowers/specs/2026-05-02-rust-ification-kickoff.md (v7 FROZEN).

# Install Rust toolchain (rust-toolchain.toml auto-pins 1.94)
rustup toolchain install 1.94
rustup target add wasm32-unknown-unknown

# build / test / lint
cargo check --workspace
cargo test --workspace
cargo clippy --workspace --all-targets -- -D warnings
cargo check --target wasm32-unknown-unknown -p op-host-web --no-default-features --features web  # kickoff §1.2 wasm32 invariant
cargo deny check && cargo deny --target wasm32-unknown-unknown check bans        # cargo-deny (native + wasm32 bans; CI uses cargo-deny-action@v2)

Entry crates (crates/ — build targets):

Shared library crates: op-editor-core (canonical .op state), op-editor-ui (platform-free widgets + RenderBackend), op-editor-host-core (transport-free host state machines), op-mcp, op-ai, op-ai-skills, op-codegen, op-orchestrator, op-figma, op-git, op-opmerge, op-pen-loader, op-design-lint, op-config-store, op-process-io, op-acp, op-i18n, op-rpc-transport — plus op-smoke (headless design-turn test runner). The browser bundle renders through the official CanvasKit skia WASM (loaded separately), so the retired skia-safe-op wasm fork + wasm-libc-shim no longer exist.

Submodule: vendor/agent → github.com/ZSeven-W/agent-rs (cross-product Rust agent runtime).

Contributions are welcome! See CLAUDE.md for architecture details and code style.

1. Fork and clone
2. Enable the version drift check: git config core.hooksPath .githooks
3. Create a branch: git checkout -b feat/my-feature
4. Run checks: cargo test --workspace && cargo clippy --workspace --all-targets -- -D warnings
5. Commit with Conventional Commits: feat(canvas): add rotation snapping
6. Open a PR against main

• Design variables & tokens with CSS sync
• Component system (instances & overrides)
• AI design generation with orchestrator
• MCP server integration with layered design workflow
• Multi-page support
• Figma .fig import
• Boolean operations (union, subtract, intersect)
• Multi-model capability profiles
• Cargo workspace with reusable Rust crates and web SDK packages
• Rust desktop & web editor
• CLI tool (op) for terminal control
• Built-in Rust agent runtime with multi-provider support
• i18n — 15 languages
• Wasm-backed viewer SDKs for JavaScript, React & Vue
• Style Guides with tag-based matching and MCP tools
• Concurrent Agent Teams with delegation and canvas indicators
• Git integration — clone, branch, push/pull, folder-mode three-way merge
• Canvas export (SVG / PNG / JPEG / WEBP / PDF)
• Collaborative editing
• Plugin system

OpenPencil is free and open-source. Development is funded by people who find it useful — thank you for keeping the canvas open.

Thanks to MrQyun — want your name here too? Become a sponsor →

Join our Discord

Recognized community: LINUX DO

We are grateful to the upstream maintainers whose work OpenPencil builds on. These copies are maintained only for OpenPencil-specific integration needs:

• casement — forked from winit.
• anthropic-agent-sdk — vendored from bartolli/anthropic-agent-sdk and maintained as a local fork.

Each project remains subject to its respective upstream license.

MIT — Copyright (c) 2026 ZSeven-W