哪些设计工具可使用MCP？3款流行的AI软件盘点！

MCP（模型上下文协议）火得一塌糊涂，如何在设计工作中应用MCP来提升效率，是许多设计师共同探讨的问题，深入研究，它还会引出另一个问题：

？

纵观海内外主流的设计工具，体验下来发现，支持MCP的设计工具有3款——国外的

，国内的

和

，这三款设计工具的共同之处在于，目前都维持在比较高频的更新，因此也及时跟进了当下最新的AI技术。

方便起见，下面给大家介绍在Figma、Pixso和墨刀中使用各自MCP的具体步骤，以便于你选择合适的工具来提升设计效率。

客观而言，Figma MCP功能较为全面，提供两种服务器连接方式：

桌面MCP服务器需要先在本地安装Figma客户端，远程MCP服务器则没有客户端的要求。

想基于Figma MCP实现设计驱动代码生成，还需要另一类重要的“参与者”——MCP客户端，这类工具主要是各种AI编程工具或具备代码生成能力的IDE（集成开发环境），如Cursor、Claude Code、Windsurf、Codex、VS Code、Replit等，具体可查看Figma的MCP目录页面。

本地MCP服务器通过Figma的桌面应用程序运行，适合大多数个人开发者和小型团队，这也是体验MCP功能最快的方法。

准备好环境：下载并安装Figma桌面应用程序。如果你之前已经安装了Figma，要确保应用是最新版本。

切换到研发模式：创建或打开一个Figma设计文件，在底部工具栏中，切换到研发模式（快捷键Shift+D）。值得一提的是，Figma研发模式仅限订阅用户使用，因此如果你使用的是免弗版，可考虑使用三方的插件Cursor Talk To Figma MCP Plugin。

将MCP服务器连接到MCP客户端：MCP客户端有多种选择，这里以炙手可热的Cursor为例。打开Cursor，进入设置界面。找到和MCP相关的配置项，一般在“Tools & MCP”菜单下。

点击“Add MCP Server”，把Figma MCP服务器地址（本地或远程）粘贴进去，按下Ctrl/Command+S，保存配置。

Figma设计稿自动生成代码：成功连接后，Cursor界面上一般会有状态指示灯（比如右下角的小圆点变成绿色），这表示它已经准备好通过MCP和Figma通信了。完成以上步骤后，你就可以开始体验从设计到前端代码的智能转换了。

Figma MCP是海外设计工具的代表，鉴于它在海外占据较高的市场份额，它的不少功能都仅对订阅用户开放，导致免费用户无缘用上最新的功能。

不过幸运的是，除了Figma，国内两款具有代表性的设计工具Pixso和墨刀，它们也推出了各自的MCP功能，可供用户免费使用和体验。

Pixso是新一代的产品设计工具，内置原型、设计和白板三大功能模块，覆盖产品设计的用研、原型、设计和交付全流程。

Pixso MCP可实现将Pixso设计稿数据传送至包含AI编程工具的本地IDE（如Cursor、VS Code、Windsurf等）中，智能化生成前端代码，高效实现设计到代码的转变。

使用Pixso MCP，需要确保Pixso桌面端版本不低于2.2.0。在Pixso客户端打开想转为代码的设计稿，让打开的设计文件保持激活态。

在打开的Pixso设计文件，点击左上角的文件菜单，选择Pixso MCP > 打开本地MCP服务器。

接着打开Cursor代码编辑器，点击左上角的文件，选择首选项 > Cursor Settings，打开Cursor设置页面。

在打开的Cursor设置页面，找到MCP服务器的配置项Tools & MCP。点击右侧的New MCP Server，会打开Cursor MCP的配置页面，将Pixso MCP服务器的地址添加进去。

粘贴Pixso本地MCP服务器地址后，按下快捷键Ctrl/Cmd+S，让MCP配置生效。

回到Cursor的Tools & MCP配置页，确认刚添加的Pixso MCP右下角的圆点为绿色，代表本地的MCP服务可正常运行。

在Pixso的设计画布中，用鼠标选中你希望生成代码的任何一个部分，可以是一个小小的按钮，也可以是一个复杂的卡片组件，甚至是整个页面容器。

选中后右击鼠标，选择复制/粘贴为 > 复制链接，获取指向当前元素的链接。

切换到Cursor编辑器，打开AI面板，切换到Agent模式，在对话框粘贴刚复制的链接，并在后边输入一句简单的自然语言指令，例如“为当前选中的画板生成对应的HTML代码，将代码保存到index.html，并将文件存放在电脑桌面。”

按下回车，Cursor会通过MCP协议向Pixso询问选中图层的设计数据，Pixso MCP则迅速响应，将结构化的HTML信息传递回去。几秒钟之内，一份高度还原设计稿、代码结构清晰的前端代码便呈现在你的编辑器中。

依托Pixso推出的MCP功能和AI编程工具Cursor，从设计稿到可运行的前端代码，转化过程就在这一次简单的“选中”与“对话”之间完成了，对比过去漫长的产设研协作工作流，Pixso MCP + Cursor这种新的方式简直是降维打击。

如果你也想体验

的高效协作方式，不妨打开最新的Pixso客户端，体验前沿AI工具的神奇魔力！

墨刀是老牌的产品原型设计工具，墨刀最新推出的墨刀MCP把原型设计、交互生成能力通过MCP标准开放出来，工程师在日常的AI开发环境里就能直接调用，不再需要额外切换到设计软件，设计到代码一步到位。

首先登录

并进入工作台，或者直接前往

页面。点击右上角的头像菜单，选择“令牌设置”，创建一个新的令牌（Token）。这个Token就是你在第三方工具中使用墨刀MCP功能的“通行证”，之后在Cherry Studio中会用到。

打开Cherry Studio应用，进入MCP配置页面，点击“添加 MCP 服务器”。接着，选择从JSON导入的方式，然后粘贴墨刀官方提供的MCP JSON配置代码。完成后点击“保存”，并记得开启 MCP 开关，让系统正式加载配置。

回到Cherry Studio的聊天界面，打开MCP功能开关。在工具列表中选择刚刚配置好的墨刀MCP作为当前使用的工具。这一步完成后，你就已经打通了Cherry Studio与墨刀之间的连接通道。

在Cherry Studio的聊天窗口中，直接输入你的需求，AI 会自动理解你的语义，并判断是否需要调用墨刀MCP功能。整个过程无需手动干预，AI会帮你把设计和开发环节一气呵成，生成结果还能直接用于项目落地。

以上就是本次想和各位分享的所有内容，希望能帮到有需要的朋友。