关于 CoDesign
CoDesign 是面向编码 Agent 的设计引擎,可创建和编辑适用于印刷、社交媒体与视频的可编辑设计。其 MCP 服务通过 IMG.LY 的 CE.SDK CreativeEngine 提供设计操作,并可导出印刷就绪 PDF、图像和视频。
主要功能
- 01创建和编辑可编辑设计
- 02调整尺寸并本地化版式
- 03根据 CSV 批量生成
- 04导入 PDF、PSD、PPTX 和 Lottie
- 05导出印刷就绪 PDF、图像和视频
适用场景
- 01将一张图适配多个渠道
- 02重设计导入的 PDF
- 03根据 CSV 生成模板设计
- 04准备含出血和 CMYK 的印刷文件
MCP 相关
MCP 服务向 Agent 主机提供 edit、preview、export、list 和 history 等设计工具。它通过 stdio 运行,并使用 IMG.LY 的 CE.SDK CreativeEngine 进行版式处理、渲染和导出。
配置
本地服务的配置在各客户端中通用,复制后粘贴到客户端的 MCP 配置文件即可。
工具
19收录的工具列表 · 更新于 2 周前
| 参数 | 类型 | 必填 | 说明 |
|---|---|---|---|
| parent | string|null | 是 | 先前 edit 返回的父修订 ID(字符串)。要创建新的设计根节点,请使用 JSON null 字面量。必需——没有隐式默认值。 |
| code | string | 是 | 异步 JS 代码体。作用域中包含 `engine` 和 `engine.design`(首选的嵌套属性门面);每个成员都返回 Promise(请 await):create({ type, name?, props?, children? }, { parent? }), setProps(id, props), getProps(id, select?) — 参见 api 技能。返回值必须严格遵守 handbook 中的约定。 |
| title | string | 否 | 设计的显示名称。仅在 parent=null(创建新设计)时设置。要在链中途重命名,请使用 `rename` 工具。 |
| note | string | 否 | 自由格式的描述文本——说明此次 edit 完成的内容。仅为元数据,不影响执行。 |
| render | boolean | 否 | 默认 true:修改型 edit 的结果以(第一个)已更改页面的缩小渲染图结尾。对于查看画布无助益的只读或诊断类 edit,可设置 false 以跳过图片。 |
| fork | boolean | 否 | 仅当用户明确要求丢弃自己在浏览器编辑器中的更改,并从较旧修订分支时,才设置 true。否则,如果某个 parent 到 head 的路径中包含用户在编辑器中的保存操作,`edit` 会拒绝该 parent。 |
| skills | string | 否 | 可选:此次 edit 所遵循的 CoDesign 技能名称,多个名称以逗号分隔(例如 "handbook,api,judge")。这些名称会随使用情况遥测数据发送;edit 本身会忽略它们。 |
详细介绍
CoDesign
面向 Agent 时代的设计层。
CoDesign 为你的编码 Agent 提供真正的设计引擎。直接在聊天中生成、编辑和自动化处理_完全可编辑_的设计作品,涵盖印刷品、社交媒体素材和视频,然后导出可直接印刷的 PDF、图像、mp4 视频等。由你掌舵,Agent 编辑同一场景,而你始终掌控最终成果。
它以 MCP 服务(以及 Claude Code 插件)的形式提供,将 IMG.LY 的 CE.SDK CreativeEngine 交给你的 Agent——这也是 IMG.LY 商业 SDK 背后的生产级引擎。以下每种配置都会通过 stdio 启动已发布的 npm 包 @imgly/codesign-mcp;无需单独安装——首次使用时,npx 会自动获取它。
可以制作什么
用通俗语言向你的 Agent 提出要求:
- 为所有渠道调整尺寸 — “把这条 Instagram 帖子制作成 Story、LinkedIn 和 X 版本。”
- 让图像可编辑(需要免费的 IMG.LY 账号)— “把这张扁平的产品照片拆分成图层,把产品放到我们的品牌背景上,并让它可以编辑。”
- 为现有 PDF 更换风格 — “将这个 datasheet.pdf 导入为可编辑设计,应用我们的品牌套件重新设计,并导出 A4 和网页版本。”
- 根据 CSV 批量生成 — “按照 speakers.csv 中的每一行生成一张演讲者卡片,使用同一模板,且全部可编辑。”
- 为印刷做好准备 — “把这张传单制作成 A4 印刷 PDF,添加 3 mm 出血并使用 CMYK。”
- 更新现有设计 — “打开去年的 flyer.psd,替换日期和场地,然后重新导出。”
- 本地化设计 — “把这张海报翻译成德语,并重新调整版式,确保内容不会溢出。”
- 制作短视频(生成音乐和配音需要免费的 IMG.LY 账号)— “把这张海报制作成一段 15 秒的竖屏短视频:让标题动起来,剪辑切换三张产品图,并配上背景音乐和配音。”
- 制作发布宣传图 — “使用我们的 Logo 和品牌色制作 v2.0 发布宣传图,尺寸适配 X、LinkedIn 和 OG-image。”
- 制作 App Store 宣传图 — “根据这五张屏幕截图,制作符合品牌风格、涵盖所有尺寸的 App Store 截图和 Play Store 功能宣传图。”
工作原理
三层架构,一个产品:
- 插件 — 提供技能、斜杠命令和内置设计手册,供你的 Agent 参考,从而设计得_更出色_(为设计应用品牌风格、本地化、调整尺寸,并检查自身输出质量)。这是需要安装的部分。
- MCP 服务(
@imgly/codesign-mcp)— 通过 MCP 提供设计工具(edit、preview、export、list、history等),由任何 Agent 宿主通过工具调用驱动。 - CE.SDK CreativeEngine — IMG.LY 真正的无头设计引擎,负责实际的版式设计、渲染和导出。
许可
本仓库中的 Claude Code 和 Codex 插件、市场清单、技能和文档均根据 MIT 许可证 发布。CoDesign 引擎本身通过 npm 包 @imgly/codesign-mcp 分发,是 IMG.LY 的专有软件,可免费在本地使用。完整条款随包附带,文件名为 LICENSE.md。
为什么真正的引擎很重要
其他所有设计 Agent 都在网页画布上绘图,这种权宜之计遇到难题时就会失效。CoDesign 使用一款历经多年打磨、适用于印刷、视频和社交媒体的生产级引擎:
- 真实的印刷与色彩保真度 — 支持 CMYK、出血和 ICC 配置文件,而不只是 RGB 屏幕输出。
- 确定性的输出 — 无论在哪里渲染,结果都完全一致,不受浏览器或配置影响。
- 原生性能 — 专为此用途打造的引擎,即使在大规模应用和处理大量素材时也能保持快速。
- 全面兼容 — 可导入 InDesign、PSD、PowerPoint(PPTX)、PDF 和 Lottie;可导出可直接印刷的 PDF、图像、视频和 HTML。
要求与已知限制
请先阅读——以下故障模式不会显示任何提示。
- 需要 Node.js ≥ 22.15,且不会随附提供。 服务使用系统上的 Node。如果
PATH中没有 Node(或 Node < 22.15),宿主会报告服务启动失败,但不会给出有用的原因——通常显示为local: 0和MCP error -32000。请先安装 Node 22.15+:https://nodejs.org。 - 请固定使用
@0.5.1——每个配置示例都刻意指定了这个确切版本。 插件随附的技能是基于该版本构建的,使用不带版本号或带发行标签的npx会让这些技能与不同版本的服务搭配。每次发布都会用新的固定版本重新发布此仓库;要升级,请更新插件(或你的配置示例)。 - 不支持在 Windows 上直接使用裸
npx。 直接启动npx的宿主会遇到spawn npx ENOENT(anthropics/claude-code#58510)。 目前请使用 WSL;原生 Windows 启动器即将推出。
安装
Claude Code
从市场安装插件:
claude plugin marketplace add imgly/codesign
claude plugin install codesign@imgly-codesign
或者,不安装插件,直接添加 MCP 服务:
claude mcp add codesign -- npx -y @imgly/[email protected] stdio
Codex
从市场安装插件:
codex plugin marketplace add imgly/codesign
codex plugin add codesign@imgly-codesign
或者,不安装插件,直接添加 MCP 服务:
codex mcp add codesign -- npx -y @imgly/[email protected] stdio
Antigravity CLI
克隆仓库并安装插件文件夹:
git clone https://github.com/imgly/codesign
agy plugin install ./codesign/plugins/codesign
或者,不安装插件,直接添加 MCP 服务:
agy mcp add codesign -- npx -y @imgly/[email protected] stdio
Gemini CLI
Gemini CLI 现已支持 Gemini Code Assist Standard/Enterprise 和 API 密钥账户;使用个人 Google 账户时,请改用上文的 Antigravity CLI。
直接从公开仓库安装为扩展:
gemini extensions install https://github.com/imgly/codesign
或者,手动将服务添加到 ~/.gemini/settings.json:
{
"mcpServers": {
"codesign": {
"command": "npx",
"args": [
"-y",
"@imgly/[email protected]",
"stdio"
]
}
}
}
其他 MCP 宿主
其他所有宿主都会启动同一个 stdio 服务——只有配置文件和顶层键不同。将此代码块添加到宿主的 MCP 配置中:
{
"mcpServers": {
"codesign": {
"command": "npx",
"args": [
"-y",
"@imgly/[email protected]",
"stdio"
]
}
}
}
| 宿主 | 配置文件 | 备注 |
|---|---|---|
| Cursor | .cursor/mcp.json | 按原样使用 |
| Windsurf | ~/.codeium/windsurf/mcp_config.json | 按原样使用 |
| VS Code | .vscode/mcp.json | 使用键 servers,而不是 mcpServers |
| Zed | settings.json | 使用下方的 context_servers 结构 |
VS Code(servers 键):
{
"servers": {
"codesign": {
"command": "npx",
"args": [
"-y",
"@imgly/[email protected]",
"stdio"
]
}
}
}
Zed(context_servers):
{
"context_servers": {
"codesign": {
"command": {
"path": "npx",
"args": [
"-y",
"@imgly/[email protected]",
"stdio"
]
}
}
}
}
超越本地设备
目前,CoDesign 可在你的设备上免费运行。当你需要更多功能时——始终在线的托管服务、自有基础设施(VPC / 本地部署),或完整集成在画布中的设计 Agent——只需更改配置,即可让同一构建模块升级,无需更换供应商。没有厂商锁定。请联系我们:[email protected]。
支持
如有疑问或问题,请联系:[email protected]。此发行版本由 IMG.LY 的源代码仓库生成。
评论
一个开放协议,规定了 AI 应用如何以统一方式连接外部工具与数据源。客户端负责与模型对话,MCP 服务负责提供工具、资源和提示模板,两者通过标准消息通信,同一个服务可以被不同客户端复用。