Cursor接入Figma教程

一、官方推荐方式(最稳)

Figma 官方现在推荐直接在 Cursor 里安装 Figma Plugin。


二、5分钟完成接入

第一步:安装 Cursor

官方下载:

Cursor 官网


第二步:打开 Cursor

快捷键打开命令面板:

Windows

复制代码
复制代码
Ctrl + Shift + P

Mac

复制代码
复制代码
Cmd + Shift + P

第三步:打开 AI Chat

搜索:

复制代码
复制代码
Open Chat

第四步:安装 Figma MCP 插件

在 Cursor 聊天框输入:

复制代码
复制代码
/add-plugin figma

然后回车。

会看到:

复制代码
复制代码
Add Plugin

点击安装。


五、授权 Figma

安装完成后:

复制代码
复制代码
Cursor Settings
→ Tools & MCP
→ Connect

然后:

复制代码
复制代码
浏览器会打开 Figma 授权

点击:

复制代码
复制代码
Allow Access

即可。


六、成功后的效果

你会在:

复制代码
复制代码
Settings → MCP

看到:

复制代码
复制代码
Figma MCP Connected

说明成功了。

然后测试是否成功

直接在 Cursor Chat 输入:

复制代码
复制代码
读取我的 Figma 文件

或者:

复制代码
复制代码
根据这个 Figma 页面生成 Vue2 页面

https://www.figma.com/xxxx
相关推荐
易知微EasyV数据可视化1 天前
从一个 SVG 清洗工具开始:设计师 howto 零帧起手开发 Figma 插件
人工智能·figma
console.log('npc')4 天前
2026 实测:Grok 4.5 与 Grok 4.6 怎么选?前端开发、教程写作、Figma 还原选型指南
前端·大模型·ai编程·figma·grok
慧都小项4 天前
从 Figma 到 Qt:Qtitan 能减少哪些界面还原工作?
前端·qt·嵌入式·figma·图形界面·工业界面·qtitan
末代iOS程序员华仔15 天前
iOS个人开发者账号申请为啥会被卡住
ios·swift·figma
Wang's Blog15 天前
Vibe Coding一人即团队系列19:Figma原型导出与Claude Code优化流程实践
人工智能·figma·stitch
撑伞的鱼993716 天前
2026年前端AI编程工具评测:Figma 还原、组件复用、跨文件联动三项对比
前端·ai编程·figma·效率工具·ai编程工具
末代iOS程序员华仔19 天前
Codex + Figma 生成 Objective‑C (UIKit) 完整工作流
c语言·开发语言·figma
末代iOS程序员华仔19 天前
Cursor 编辑器 + Figma‑MCP 服务器(真正让 Codex 直接读取 Figma 链接,高级方案)
服务器·编辑器·figma
leoZ23124 天前
Vue3 还原一个企业级后台-08-API注册管理
目标检测·机器学习·分类·状态模式·迁移学习·集成学习·figma
小疯仔1 个月前
关于CodeBuddy使用figma
figma