Step1：让 AI 给你配置 MCP
在 VSCode 中打开项目，呼出 GitHub Copilot 对话框，模式选择 Agent，模型建议 Claude 3.7 Sonnet，提问：
https://github.com/GLips/Figma-Context-MCP 如何配置能让你在 vscode 里使用这个 mcp
之后跟着提示操作即可完成配置，如果有什么需要装的 VSCode 插件它会自动帮你装，甚至自动生成了配置说明文档。
![配置结果截图]
由于不能保证 AI 每次生成的答案都一致，这里附上运行结果作为参考。可以看到它在项目文件夹最外层建了一个.vscode 文件夹，在 settings.json 文件里加上了配置。如果你的项目本来就有这个 settings.json 文件它应该会加在文件最后面。
{"mcpServers":{"Framelink Figma MCP":{"command":"cmd","args":["/c","npx","-y","figma-developer-mcp","--figma-api-key=这里稍后替换成你自己的密钥","--stdio"]}}}
Step2：替换成自己的 Figma 密钥
打开 Figma 的网页点击左上角自己的头像 -> settings -> Security -> Generate new token。设置路径可能会有变化，自行查找找到 Generate new token 即可。
点击之后会出现弹窗，随便起个名字比如 mcp，然后把下面的权限列表一个个打开选择读或写，要不然默认是全部 No access 的。
注意默认是 30 天过期，30 天后需要建一个新的才能继续用。
![生成 Token 弹窗]
都选完之后点右下角的 generate token 之后会生成一个密钥，这是你唯一一次复制它的机会，没复制好就关掉窗口了就只能重新建了。把这个密钥复制到 settings.json 文件中–figma-api-key=后面。
Step3：如何使用
以官方电商 UI 模板里的商品卡片为例，在 Figma 设计图上选中你要的部分图层，右键后点击 Copy link to selection。
![复制链接]
之后就可以把链接贴到对话框了，先来测试一下配置是否成功了，确保模式是 Agent，提问：
