Flato Design MCP

io.github.sologovision由 GitHub 账号 sologovision 发布v0.1.3更新于 Oct 24, 2026

Connect AI agents to Flato's editable canvas runtime through a hosted MCP server.

已验证Streamable HTTP可网页运行效率与工作流媒体与设计

概览

AI 生成的概览

托管式 MCP 服务器，将 AI 代理连接到 Flato 可编辑设计画布，用于创建、修改、导出和检查视觉项目。

可以做什么
识别当前登录账号并管理项目：查看身份、创建或选择项目、打开实时编辑器、轮询可写入状态、读取分享链接。在改动前读取设计上下文与画布基础规范。使用明确的页面与区块 ID 创建和更新页面、区块，包括页面级交互。将成果导出为 PNG、JPG、PDF 或纯图片 PPTX，并查看反馈进行视觉检查。
适用场景
当希望代理在实时可编辑画布上制作或修改设计，而不是生成一次性图片或静态 HTML，并且用户希望同时在浏览器编辑器中继续操作时使用。
运行要求
通过 streamable HTTP 访问的远程托管端点，无需本地安装包。需要 Flato 账号并通过浏览器 OAuth 登录。连接不要求付费订阅，但部分功能、导出、更高用量及付费图像生成可能取决于用户的套餐或额度。
安装前请注意
涉及 OAuth 凭据：不要把 Flato 密码、bearer token、refresh token 或本地 OAuth 缓存内容粘贴到对话中，也不要查看本地令牌存储。代理会写入项目，进行大范围或有风险的修改前应先备份。部分导出和图像生成可能消耗套餐额度或需要付费。

安装

在 SourceWeft 中

  1. 打开 控制台中的 Flato Design MCP，将其添加到工作区。
  2. 连接 所需的 凭据。它们会被私密存储，绝不会在公开页面上展示。
  3. 为需要使用其工具的对话启用该服务。

Web executable，通过 Streamable HTTP。 远程服务在工作区中配置后即可从网页运行时运行。

交给智能体安装

把这段提示词粘贴到 Claude Code、Codex、Cursor 等智能体，或 SourceWeft 对话中。智能体会读取该服务器的安装指南，先向你展示发布者、端点和登录方式，经你同意后再把它添加到你的客户端。密钥不会写进任何命令。

阅读 https://sourceweft.com/mcp/io.github.sologovision%2Fflato-design-mcp/install.md，并按其中说明把这个 MCP 服务器接入我的客户端。修改任何配置之前，先告诉我它的发布者、端点和登录方式，等我确认。不要把 API 密钥写进命令或我会提交的文件；问我密钥应从哪里获取。

查看智能体所依据的安装指南

其他 MCP 客户端

把它添加到你客户端的 mcpServers 配置中。 客户端会在首次连接时完成 OAuth 登录。

{
  "mcpServers": {
    "flato-design": {
      "type": "http",
      "url": "https://api.flato.ai/api/mcp/editor"
    }
  }
}

README

Flato Design MCP

Flato is the native canvas runtime for AI design.

Flato gives AI agents a live, editable visual canvas for design work. Through MCP, agents can create, inspect, revise, export to PNG, JPG, PDF, or image-only PPTX, and QA Flato projects while users keep full access to the browser editor.

Flato Design MCP connects Codex, Claude Code, Cursor, and other MCP-capable agents to that native canvas.

text
https://api.flato.ai/api/mcp/editor

This repository is the official distribution package for setup docs, the base guide skill, Codex plugin packaging, examples, and registry/review metadata. It does not contain the Flato MCP server source code.

Positioning

Flato is the native canvas runtime for AI design, not a one-shot image generator or a static HTML deck generator. The MCP workflow is built around editable pages, structured blocks, fresh design context, explicit page and block ids, live editor handoff, and visual QA.

Use this package when you want an AI agent to operate Flato's editable visual canvas safely through MCP.

What's Included

  • skills/flato-design-mcp-guide: installable base guide skill for agents.
  • plugins/flato-design-mcp-codex: Codex plugin package with MCP config and the guide skill.
  • .agents/plugins/marketplace.json: Codex marketplace descriptor for this repo.
  • docs/: setup, OAuth, permissions, and troubleshooting notes.
  • registry/: MCP registry and platform review metadata drafts.
  • examples/prompts/: first prompts for testing the integration.

Codex Install

Codex can install this repo as a plugin marketplace:

bash
codex plugin marketplace add sologovision/flato-design-mcp --ref maincodex plugin add flato-design-mcp-codex@flato-design-mcpcodex mcp login flato-editor

Then open a new Codex conversation and verify:

text
Use Flato Design MCP. Call flato_whoami first and report the result. Do not create, edit, or write any project.

See Codex setup.

Claude Code Install

Add the hosted Flato MCP server:

bash
claude mcp add --transport http flato-editor https://api.flato.ai/api/mcp/editor

Then use the guide skill in skills/flato-design-mcp-guide.

See Claude Code setup.

Cursor And Other MCP Clients

Use the hosted MCP server URL:

text
https://api.flato.ai/api/mcp/editor

Then follow the workflow in skills/flato-design-mcp-guide/SKILL.md.

See Cursor setup.

OAuth

Flato Design MCP uses browser OAuth. If needed, Flato asks you to sign in or create an account before authorization.

Do not paste Flato passwords, bearer tokens, refresh tokens, or local OAuth cache contents into an agent conversation.

See Authentication.

Account And Subscription

A Flato account is required for OAuth. A paid Flato subscription is not required to install, connect, or start using Flato Design MCP.

Some features, exports, higher usage, team/workspace capabilities, or paid image generation and editing may still depend on the authenticated user's Flato plan or credits. Agents should report plan or credit errors from MCP instead of asking users to subscribe in advance.

First Agent Workflow

After connecting Flato MCP, an agent should:

  1. Call flato_whoami.
  2. Create or select a project with flato_create_project, flato_use_project, or flato_use_share_link.
  3. Open the live Flato editor when requested.
  4. Poll flato_get_project_status until canWrite=true.
  5. Read flato://canvas/fundamentals-v1, or call flato_get_canvas_fundamentals if resource reading is unavailable.
  6. Call flato_get_design_context before any write.
  7. Use concrete page and block ids returned by fresh context reads.
  8. Inspect mcpFeedback after writes.
  9. Export important results with flato_export; use PNG or JPG preview exports for visual QA.

Interactions

Page-level interactions are authored through interactiveScript on flato_create_pages and flato_update_pages. Agents should rely on current MCP tool schemas and flato://canvas/fundamentals-v1 for the full interaction contract instead of copying static schema fragments from this repo.

Supported inline interaction events include click/input/change and desktop hover/mouse events such as onclick, onmouseover, onmouseout, onmouseenter, and onmouseleave. Hover is useful for desktop presentations; include click/tap behavior or a visible fallback when mobile touch users matter.

Verified Smoke Test

The v0.1.3 Codex plugin package uses the full guide skill and the current hosted Flato MCP contract.

The Codex install path has been verified with:

bash
codex plugin marketplace add sologovision/flato-design-mcp --ref maincodex plugin add flato-design-mcp-codex@flato-design-mcpcodex mcp login flato-editor

An independent Codex CLI session successfully called flato_whoami through the installed flato-editor MCP server without creating or editing any Flato project.

Screenshots

GitHub release

[Flato Design MCP GitHub release page]

Codex plugin install

[Codex plugin install verified]

Read-only MCP smoke test

[Read-only MCP smoke test passed]

Editable presentation canvas

[Editable presentation canvas in Flato]

Canvas editing and content tools

[Flato canvas editing and content tools]

AI-assisted canvas edits

[AI-assisted edits in the Flato canvas]

Codex working with the live canvas

[Codex working with the live Flato canvas]

Release Assets

GitHub releases attach:

  • flato-design-mcp-guide-vX.Y.Z.zip: installable base guide skill.
  • flato-design-mcp-codex-vX.Y.Z.zip: Codex plugin package.

Safety Principles

  • Do not ask users to paste passwords, bearer tokens, or local OAuth tokens.
  • Do not inspect local OAuth or token stores.
  • Do not guess pageId or blockId.
  • Do not claim generated assets are placed until a design write uses the returned asset URL.
  • Use backups before broad or risky edits.

Related Flato Docs

Support And Security

  • Use GitHub Issues for setup and documentation problems.
  • See SECURITY.md for security reporting guidance.
  • Do not include tokens, passwords, or private project content in public issues.

Roadmap

This is the base package. Scenario-specific skills such as flato-presentation-skill should build on this guide instead of duplicating the connection, OAuth, targeting, and safety workflow.

来源：README.md，提交 675a871

工具

0
该服务器需要登录，因此 SourceWeft 无法在没有账号的情况下读取其工具，也未收录。已连接账号所能看到的内容可能因账号及其权限而异。

版本历史

1
  1. v0.1.3最新Sep 16, 2026

评分

已满足适用检查项的 85%

该评分衡量此收录条目的完整程度，依据注册中心条目、端点与公开来源计算得出。它不是对服务器本身的评价，也不表示服务器安全或当前可用：可连通性是带日期的检查结果，评分也不包含安装量或用户评价。

  • 近 30 天内可连通必需25 分
  • 已声明认证方式必需10 分
  • 已列出工具15 分

    请让服务器在无凭据时响应 tools/list，或发布可在沙箱中无凭据启动的软件包。

  • 描述必需15 分
  • 图标10 分
  • 文档15 分
  • 许可证10 分