tuval-studio

Tuval Studio MCP 服务 🎨

面向 AI Agent 的平面设计 MCP、AI 设计 MCP 与 PDF 生成器 MCP

Tuval Studio MCP 是 Tuval Studio（tuval.site）的官方 MCP 服务。

它为 CodeDL、Claude Desktop、Cursor、Codex、Antigravity、Windsurf、Cline、Roo-Code 和 OpenCode 等桌面 AI Agent 提供自主的视觉引导设计引擎，可用于：

• 🎨 平面设计 MCP 与 AI 设计 MCP： 自动化矢量排版、字体设计、网格渐变和智能布局审查。
• 📄 PDF 生成器 MCP 与目录生成器： 生成多页 PDF 目录、杂志版式、宣传册和演示文稿。
• 📊 演示文稿生成器与幻灯片： 创建高分辨率多页幻灯片，字体同步且视觉品牌风格统一。
• 📱 社交媒体设计： 一键制作营销横幅、Instagram 快拍、YouTube 缩略图和广告，不会出现文字溢出。

正在寻找 设计 MCP、PDF MCP、目录 MCP 或 平面设计 MCP？Tuval Studio MCP 可将你的 AI Agent 直接连接到交互式客户端浏览器画布，提供 100% 隐私保护和实时视觉反馈！

---

🌟 核心功能

• ⚡ 由 APIDL Engine 驱动（apidlai.com）： 由 apidlai.com 开发的突破性闭环设计编排引擎。通过 2–3 个迭代阶段（draft -> refine -> final）收敛，并自动执行质量关卡审查。与传统的单次调用 MCP 工具相比，可将令牌成本降低 约 92%，并将执行速度提升 10 倍。
• 🚀 零云端且 100% 私密： 完全通过高速本地 WebSocket 桥接（ws://127.0.0.1:8765）在本地浏览器中运行。无需账户，也不在服务器上存储数据。
• 📚 多页 PDF 目录引擎： 使用 pdf_export_catalog 自主创建、管理和导出多页杂志、作品集、产品宣传册和演示文稿。
• 👁️ 多模态视觉闭环： 每项操作都会返回高分辨率视觉快照（Base64 PNG）和图层坐标，让 AI Agent 直观地检查、评估并完善设计。
• 🛡️ 防溢出与边界保护： 内置验证协议，确保所有字体、按钮和徽章都留有安全边距（最小 50px），不会发生裁切。
• ✨ 完整平面设计套件： 支持多图层矢量操作、自定义 Google Fonts（Sora、Inter、Playfair、Cinzel、Syne 等）、网格渐变、几何图案纹理以及一键 AI 背景移除。
• 💻 本地文件加载： 将电脑硬盘上的任意本地照片、素材或徽标直接加载并合成到画布上。

---

⚡ AI Agent 快速配置

将以下配置添加到 AI Agent 的 MCP 设置文件中：

1. Claude Desktop（claude_desktop_config.json）

{
  "mcpServers": {
    "tuval-studio": {
      "command": "npx",
      "args": ["-y", "@ariferol01/tuval-studio-mcp@latest"]
    }
  }
}

2. CodeDL、Cursor、Codex、Antigravity、Windsurf、Cline 与 Roo-Code

{
  "mcpServers": {
    "tuval-studio": {
      "command": "npx",
      "args": ["-y", "@ariferol01/tuval-studio-mcp@latest"]
    }
  }
}

工作原理： 在浏览器标签页中打开 Tuval Studio。AI Agent 执行设计命令时，会立即连接到当前处于活动状态的画布标签页！

---

🛠️ 完整 MCP 工具目录

1. 文档与多页 PDF 引擎

工具	描述
pages_list	列出文档中的所有页面，并显示索引、尺寸和激活状态。
pages_add	创建新页面（空白页面或克隆模板），用于目录和宣传册工作流。
pages_switch	将活动画布视口切换到指定页面索引（0, 1, 2...）。
pages_duplicate	克隆当前页面布局及所有图层，以保持视觉一致性。
pages_delete	从文档中删除页面。
pages_reorder	在多页缩略胶片栏中移动页面或调整页面顺序。
pdf_export_catalog	将所有页面编译为可直接印刷的高分辨率多页 PDF 文档。

2. 画布与画板设置

工具	描述
studio_check_status	检查连接状态，并提示 Agent 打开 https://tuval.site/editor。
canvas_create_new	使用自定义宽度、高度和背景颜色初始化空白画布。
canvas_set_dimensions	应用标准尺寸或社交媒体预设（1080x1080、1080x1920、1280x720、1200x630）。
canvas_set_background	设置纯色背景、Alpha 透明度或全出血背景纹理。
canvas_set_gradient	应用网格渐变（cyber、sunset、emerald、space、gold、candy、noir）。
canvas_set_pattern	应用几何纹理（dots、grid、carbon、isometric、topography、circuit）。
canvas_load_template	加载精选设计模板（neon-sale-story、social-launch、youtube-thumbnail）。
canvas_clear	清除当前画布中的所有对象。

3. 版式与矢量形状

工具	描述
text_add	使用 Google Fonts（Sora、Inter、Playfair Display、Bebas Neue、Cinzel、Syne）添加文本。
text_update_style	更新字体系列、字号、颜色、字间距、行高、文本对齐方式和内容。
shape_add	插入几何形状（rect、circle、triangle、star、hexagon、heart、pill、badge）。
shape_update_style	修改形状填充颜色、边框描边、圆角半径（rx/ry）、不透明度和阴影。
svg_add	将精选徽章、信任贴纸、光斑、星形和标注添加到画布上。

4. 图像、媒体与本地资源

工具	描述
assets_load_from_path	从用户的本地硬盘读取图像，并将其转换为可立即放置到画布上的格式。
assets_list_local	扫描并列出工作区中可用的本地图像和徽标。
image_add	从 URL、本地文件路径或 Base64 插入图像（支持 { isBackground: true }）。
image_crop	按边界框坐标或宽高比裁剪图像。
image_remove_bg_auto	一键在客户端移除背景。
image_remove_bg_magic	使用可配置的颜色容差，通过魔棒提取背景。
filter_apply_preset	应用美学调色预设（Warm Film、Cyberpunk、Moody Noir、Vivid HDR、Film Grain）。

5. 图层管理、布局审查与视觉检查

工具	描述
design_audit_layout	自动审查所有文本和图像图层，检查是否存在溢出和碰撞。
studio_get_view	捕获高分辨率画布快照（Base64 PNG）和图层树，供 AI 进行视觉审查。
layer_reorder	调整图层堆叠顺序（bring_to_front、send_to_back、bring_forward、send_backward）。
layer_align	将图层与画布的中心、左侧、右侧、顶部或底部对齐。
layer_transform	调整旋转角度、X/Y 翻转、不透明度、投影和混合模式。
layer_duplicate / layer_delete	复制或移除指定图层。
studio_batch_actions	在一次原子调用中执行一系列多步命令。
studio_execute_apidl	迭代式闭环 APIDL 流水线：执行批量设计脚本，返回多模态视觉状态和图层碰撞审查结果，强制遵循黄金比例标准，并在 2-3 次迭代（draft -> refine -> final）中完成优化。
project_set_title	重命名设计项目。
project_export_download	触发浏览器下载 PNG、JPG、WebP 或 SVG 图形。

---

🎯 AI Agent 示例提示词（CodeDL、Claude、Cursor、Codex、Antigravity）

1. 多页产品目录与 PDF 生成

“使用 Tuval Studio MCP 创建一本 4 页的现代斯堪的纳维亚风格家具目录。第 1 页设计编辑风格封面，第 2 页和第 3 页制作带价格的产品网格，第 4 页添加联系和订购详情。通过视觉审查检查每一页的安全边距，并导出最终的多页 PDF。”

2. 社交媒体设计与横幅生成

“为产品发布设计一张高对比度的赛博朋克风格社交媒体广告横幅（1080x1080）。采用深色渐变背景、醒目字体、霓虹色提示徽章，并使用 design_audit_layout 确认没有文本溢出边界。”

3. 演示文稿生成器与路演简报

“在 Tuval Studio 中制作一份 5 页幻灯片的路演简报。保持品牌配色、现代字体层级和简洁的卡片布局，并将整套幻灯片导出为可供印刷的 PDF。”

---

🔍 标签与关键词

Tuval Studio MCP · MCP server · graphic design MCP · AI design MCP · PDF generator MCP · PDF MCP · design MCP · catalog MCP · catalog generator · presentation generator · social media design · AI agents · CodeDL · Claude · Cursor · Codex · Antigravity

---

📄 许可证

MIT © Tuval Studio