vLLM本地部署教程：高性能大模型推理引擎怎么搭
什么是Penpot（openPencil）
Penpot是第一个面向设计和代码协作的开源设计工具，被誉为"开源版Figma"。由西班牙公司Kaleidos开发，GitHub 32K+ Star。支持矢量编辑、原型设计、组件库、实时多人协作，基于SVG标准，完全自托管，数据不外传。
核心优势
| 特性 | Penpot | Figma |
|---|---|---|
| 开源 | ✅ AGPL开源 | ❌ 闭源 |
| 自托管 | ✅ Docker一键部署 | ❌ 云端only |
| 免费 | ✅ 完全免费 | 付费/月 |
| 实时协作 | ✅ 多人同时编辑 | ✅ |
| SVG原生 | ✅ 设计即代码 | ❌ 私有格式 |
| CSS Grid | ✅ 2.0支持 | ❌ |
一、Docker部署（推荐）
# 1. 安装Docker和Docker Compose
curl -fsSL https://get.docker.com | sh
sudo usermod -aG docker
newgrp docker
# 2. 下载官方配置
mkdir -p /opt/penpot && cd /opt/penpot
curl -o docker-compose.yaml \
https://raw.githubusercontent.com/penpot/penpot/main/docker-compose.yaml
# 3. 生成密钥
openssl rand -hex 16
# 4. 配置环境变量
cat > .env << 'EOF'
PENPOT_PUBLIC_URI=http://localhost:9001
PENPOT_DATABASE_URI=postgresql://penpot:penpot@db/penpot
PENPOT_REDIS_URI=redis://redis/0
PENPOT_SECRET_KEY=<上面生成的密钥>
EOF
# 5. 启动
docker compose up -d
# 访问 http://localhost:9001二、核心功能使用
1. 矢量编辑
Penpot提供完整的贝塞尔曲线编辑、布尔运算（合并/相减/相交）、蒙版、模糊等矢量工具，功能与Figma的矢量编辑器基本对齐。
2. 组件库
# 创建可复用组件：
# 1. 选中元素 → 右键 → Create Component
# 2. 组件可嵌套、覆盖、变体
# 3. 支持组件实例同步更新3. 原型交互
# 创建可点击原型：
# 1. 选中元素 → Prototype面板
# 2. 拖拽连接到目标Frame
# 3. 设置过渡动画（淡入/滑动/弹出）
# 4. 点击预览查看交互效果4. CSS Grid布局
Penpot 2.0引入CSS Grid布局，设计师可以创建响应式布局，生成的CSS符合现代Web标准，开发者可以直接使用。
5. 开发者交付
# 设计完成后：
# 1. 选中元素 → Inspect面板
# 2. 查看生成的CSS代码
# 3. 复制颜色值、间距、字体样式
# 4. 导出SVG/PNG资源提示：Penpot配合 Claude Code 或 Gemini CLI 使用，AI可以直接读取Penpot导出的SVG代码生成前端组件。
三、团队协作
- 实时协作：多人同时编辑，光标位置实时同步
- 评论系统：在设计稿上直接评论
- 版本历史：追踪所有变更
- 权限管理：团队/项目/文件三级权限
四、与Figma文件互通
Penpot支持导入Figma文件（.fig格式），迁移成本低。导入后矢量、组件、文本层基本完整保留。