在日常开发中，设计稿转代码一直是前端团队的刚需。但经过与文心快码开发者用户们的交流，我们发现原来用 Figma2Code (F2C) 智能体进行前端开发，仍存在以下痛点：
🔁流程繁琐：写代码→切到 Figma→复制链接→切回 IDE... 流程割裂，效率低下。
🚫 使用受限：像纯文本、图片这样的素材类型，无法在Figma中导出链接转成代码，还得手动处理。
⏳ 不够灵活： 无法在每次开启F2C任务时，自由地增加特定的需求，只能 在第一轮生成完毕后补充修改需求。
针对这些痛点，文心快码对 Comate AI IDE 进行了一次前端开发场景的专属升级，支持预览 Figma 设计稿、元素级选中实现、需求补充更方便。本次升级，我们还着重解决目前行业内前端开发的共性挑战（如非编辑权限下不能选中元素生成代码、不支持本地文件预览、不支持预览窗口多开、无法打开历史预览），期望帮助开发者们打造AI IDE内整合设计工具的最佳实践。前端开发交互更丝滑，设计稿转代码真正升级为自动化工作流。
一、升级亮点大放送
1. Comate AI IDE 内预览能力大大提升
-
****Figma 设计稿预览：****现在可以直接在 IDE 内打开 Figma 设计稿，无需跳出 IDE，真正告别手动切图！
-
****多类型 URL 支持：****自动识别并预览 https、http、file 等多种地址，覆盖更多开发场景！
-
****多窗口预览：****可同时开启多个设计稿或网页，随时对照比对，效率倍增！
-
****历史记录回溯：****支持预览地址历史记录，修改前效果可追踪！
2. 支持组件元素级选中，哪里要改点哪里
不论是画布、组件还是局部元素，不卡设计稿编辑权限，任何可选中的元素都能被识别支持，用户自由度大幅提升！哪里要改点哪里，so easy！老板再也不用担心我的Coding了。
3. 选中组件元素补充定制化需求
点选需要实现为代码的组件或元素，就能将设计稿添加到上下文，补充自己的Prompt，直接与F2C智能体对话，以前做不到的定制化，现在聊着天即可实现！
→"用 Element 组件库实现"
→"生成一个通用组件，放到 xxx/xxx 目录下"
→"参考我代码库中的 xxx 文件"
→"只生成框架，不要具体内容"
二、三步Get新技能
第一步：打开Comate AI IDE，找到 Figma2Code 入口，两种方式
- 进入Agents对话窗口，点击F2C智能体
- 点击侧边栏预览功能，点击「打开 Figma」
第二步：首次使用需登录授权Figma账号，然后打开需要实现的设计稿
第三步：框选/点选想要实现的设计元素，点击右下角发送到对话
F2C 智能体立即接收上下文，开启对话，完成任务。如有其他需求，可以随时在对话框进行补充。
三、如何获取最新 Comate AI IDE？
两种更新方式，即刻到 Comate AI IDE 中体验全新 Figma2Code 能力！
1. 已有IDE，升级到最新版：
点击 Comate AI IDE 界面内右上角「重启以更新」
2. 下载更新：
进入https://comate.baidu.com/zh/download#aiIde 立即下载安装最新 Comate AI IDE，体验全新 Figma2Code 智能体！