OpenPencil

OpenPencil opens .fig and .pen documents directly, so a design file behaves like a file again rather than something held inside a service. Nodes copy and paste between apps, and documents open from the editor or from the operating system file browser.

Underneath the editor sits a programmable toolkit. A headless CLI inspects node trees, runs XPath queries, and exports; an MCP server and desktop agent integrations connect it to coding agents such as Claude Code, Codex, and Gemini CLI; a headless Vue SDK lets other applications embed the editing surface.

The feature set spans authoring, automation, and handoff.

• AI editing: more than 90 tools create and modify nodes from a chat description, backed by OpenRouter, Anthropic, OpenAI, Google AI, and other compatible endpoints.
• Components and variants: reusable components, variant sets, local assets inserted as instances, and variant switching from the inspector.
• Auto layout: flex and CSS Grid layout through Yoga WASM, with gap, padding, alignment, and track sizing.
• Design to code: selections export as JSX or Tailwind, token outputs are generated, and HTML with CSS can be imported back into editable layers.
• Collaboration: peer-to-peer sessions over WebRTC carry cursors, presence, and follow mode with no server and no account.

The desktop build is around 7 MB, uses Tauri v2 on macOS, Windows, and Linux, and also runs in the browser as a progressive web app. Homebrew installs it on macOS. The project describes itself as usable today but under active development, with some rough edges.