ZSeven-W/openpencil

What it solves

OpenPencil is an open-source, AI-native vector design tool that allows users to create user interfaces and graphics using natural language prompts. It bridges the gap between conceptual design and production-ready code by automating the layout and styling process through AI agents.

How it works

The tool uses an orchestrator to decompose complex design requests into smaller spatial sub-tasks, which are then handled by concurrent AI agent teams. These agents work in parallel to generate different sections of a page (e.g., hero section, footer) and stream the results directly onto an infinite canvas. It supports a wide range of LLMs (Claude, GPT-4o, Gemini, etc.) and adapts its prompting strategy based on the model's capabilities. The design is stored in a human-readable .op JSON format, which can be exported to various frontend frameworks like React, Tailwind, Vue, and Flutter.

Who it’s for

It is designed for UI/UX designers, frontend developers, and product managers who want to rapidly prototype interfaces using AI, or for those who prefer a "design-as-code" approach where designs can be version-controlled via Git.

Highlights

• Prompt-to-Canvas: Generate full UI layouts from text descriptions with real-time streaming animation.
• Concurrent Agent Teams: Multiple AI agents work on different canvas sections simultaneously.
• MCP Server: Built-in Model Context Protocol server allowing design automation directly from terminal-based AI agents (e.g., Claude Code).
• Design-as-Code: Uses JSON-based .op files that are Git-friendly and diffable.
• Multi-Platform Export: One-click export to React + Tailwind, HTML/CSS, SwiftUI, Jetpack Compose, and more.
• Real-Time Collaboration: Peer-to-peer sessions with live cursors and conflict resolution.
• Cross-Platform: Native desktop apps for macOS, Windows, and Linux built with a Rust core.