openpencil

说一句话，AI 在画布上直接画出可编辑 UI

openpencil 是一款开源、AI 原生的矢量设计工具，用 Rust 编写，目标是成为 Pencil 的现代替代品。它把「设计即代码」落到实处：你只需输入提示词，AI 就能直接在实时画布上生成可编辑的 UI 矢量稿，而不是先出静态图再手动切图。项目最大的差异化在于并发 Agent Teams——多个 AI 智能体可同时协作处理不同设计区域，配合 MCP、Claude Code、Codex 等能力，把自然语言需求快速转成结构化界面。它支持 React、React Native、Flutter 等目标平台，产出可直接对接前端工程，减少设计与开发之间的反复沟通。对独立开发者、小团队和需要快速验证界面想法的场景来说，openpencil 试图用 AI 把「想—画—写代码」压缩成一步，同时保持矢量编辑的可控性，而不是黑盒生成。

开源 freemium 设计创意

访问官网 ↗ GitHub ↗ 文档 ↗

GitHub 星标 ★ 6092

维护状态活跃

是否开源是

定价模式 freemium

项目预览

项目数据

分类设计创意

开发团队ZSeven-W

所属国家

官网地址https://op.zseven.tech

GitHubhttps://github.com/ZSeven-W/openpencil

定价模式freemium

价格说明开源免费，官网提供在线体验，付费方案待确认

访问状态

是否开源是

开源协议MIT

主要语言Rust

技术栈/模型agent,agent-team,ai,claude,claude-code,codex,dsh-plugin,fimga,flutter,mcp,opencode,openpencil,pencil,react,react-native,rust,skill,ui,vibecoding,vibedesign

GitHub 星标★ 6092

30天Star增速

HF 下载量

上线时间2026-02-17 00:00:00

代码更新—

仓库体积—

本站数据更新—

维护状态活跃

中文支持

访问方式

移动端支持

综合评分

收录时间2026-10-08

浏览次数0

Star 增长趋势

本站每日记录该项目 GitHub 星标变化，观测越久曲线越完整

正在加载星标数据…

技术标签

使用教程

—

难度：入门约 10 分钟部署方式：本地安装 7 步

环境要求

Rust stable 工具链（从源码构建产品时必需）
Docker（用容器方式运行 Web 版时需要）
Bun >= 1.0 与 Node.js >= 18（仅 packages/ 下 Web SDK 需要）
macOS / Windows / Linux 桌面环境；Nix 方式当前仅发布 x86_64-linux

安装与启动步骤

1macOS 桌面版安装

用 Homebrew 添加官方 tap 并安装 cask，装好后可直接双击 .op 文件打开。
```
brew tap zseven-w/openpencil
brew install --cask openpencil
```
2Windows 桌面版安装

用 Scoop 添加 openpencil 桶后安装，安装过程会按需补齐微软签名的 VC++ 运行库。
```
scoop bucket add openpencil https://github.com/zseven-w/scoop-openpencil
scoop install openpencil
```
3Linux 手动下载安装

在 GitHub Releases 页面下载 .AppImage 或 .deb（Windows 则为 .exe）后自行安装。
4安装 op 命令行工具

macOS / Linux 用官方脚本安装 op CLI；加 OP_PRERELEASE=1 可获取最新预发布版。
```
curl -fsSL https://raw.githubusercontent.com/ZSeven-W/openpencil/main/scripts/install-op.sh | bash
```
5Windows 安装 op CLI

Windows 用 PowerShell 脚本安装 op CLI；也可先把 OP_PRERELEASE 设为 1 再执行。
```
irm https://raw.githubusercontent.com/ZSeven-W/openpencil/main/scripts/install-op.ps1 | iex
```
6Docker 运行 Web 版

克隆仓库后在根目录构建并运行镜像，映射 3100 端口；也可直接跑官方 ghcr.io/zseven-w/openpencil-web:vX.Y.Z 镜像。
```
docker build -f Dockerfile.web-rust -t openpencil-web-rust .
docker run -p 3100:3100 openpencil-web-rust
```
7从源码构建运行

先安装 Rust stable；桌面端执行 cargo run -p op-host-desktop，Web 端用 bash scripts/start-web-rust.sh。
```
cargo run -p op-host-desktop
```

关键配置

配置项	必填	说明	示例
`OPENPENCIL_PERSIST_WEB_CREDENTIALS_SERVE`	否	私有部署下启用浏览器凭据服务端持久化，部署范围生效	`true`
`OPENPENCIL_WEB_ALLOWED_ORIGINS`	否	公网反向代理时设置为精确来源的逗号分隔列表	`https://demo.openpencil.dev`
`OPENPENCIL_WEB_AI_ENDPOINT_ALLOWLIST`	否	允许访问内部 AI 端点的精确 URL 来源列表	`http://127.0.0.1:11434,https://llm.internal.example`
`OP_PRERELEASE`	否	让 CLI 安装脚本允许安装最新预发布版本	`1`

如何确认成功

打开 http://localhost:3100/ 能看到界面；桌面应用能正常启动并打开 .op 文件。

常见问题

Q：Docker 镜像里包含 Claude/Codex 等 CLI 吗？

A：不包含。镜像只含 Rust web host、wasm 包与 CanvasKit 资源，Web UI 仅暴露内置 agent profiles，CLI 与 ACP agent 只在原生端可用。

Q：Windows 安装包被杀毒软件报毒怎么办？

A：这是新版本低流行度触发的已知启发式误报，可按 docs/security/antivirus-false-positives.md 说明校验下载文件。

Q：便携版 zip 或 VSIX 为什么装不上？

A：这两类产物不运行提权安装程序，需要先自行安装微软最新支持的 Visual C++ Redistributable 再使用。

Q：如何安装最新的预发布版 CLI？

A：macOS/Linux 执行安装脚本时加 OP_PRERELEASE=1；Windows 先设置 $env:OP_PRERELEASE = "1" 再运行脚本。

注意事项

只有 Rust stable 是构建产品的必需项，Bun 与 Node.js 仅用于 packages/ 下的 Web SDK。
浏览器端凭据默认保存在同源 localStorage（openpencil-rust-web-credentials），同源脚本可读取，需防 XSS。
启用 OPENPENCIL_PERSIST_WEB_CREDENTIALS_SERVER 必须限定在受控、HTTPS、单一管理员配置的可信部署中。
官方 TypeScript 镜像（内置 AI CLI）已停止发布，现在只发布 Rust web-host 镜像。

核心亮点

并发 Agent Teams 让多个 AI 同时改不同区域，复杂界面生成效率更高
设计即代码，产出可对接 React/React Native/Flutter，减少手工还原
Rust 实现，性能与内存表现优于常见 Electron 设计工具

不足之处

项目较新，功能完整度与稳定性仍需时间验证
生态与插件数量相比成熟设计工具还有差距

适用场景

产品经理用一句话快速生成可讨论的界面原型
独立开发者从提示词直接得到可继续开发的前端 UI 稿
设计团队用多 Agent 并行产出多套方案做快速对比

替代项目

Penpot、Excalidraw

项目介绍

openpencil 是设计创意领域的开源项目，由 ZSeven-W 开发，是 2026 年新上线的项目。

在全站 13,916 个收录项目中，它的 GitHub 星标数（6,092）位列前 8%，在设计创意分类的 192 个项目里位列前 8%。

项目目前处于活跃维护状态，最近一次代码更新于 2026-10-07。开源免费，官网提供在线体验，付费方案。

它主要面向的使用场景是：产品经理用一句话快速生成可讨论的界面原型。同类可对比的替代方案包括 Penpot、Excalidraw。

上一篇：swiss-design-skill

下一篇：presentation-design-prompts