AI 开发

AI 调用Figma

以codex为例:

Figma 插件安装

codex 搜索插件安装,常用功能:

  • Pull Figma content:复制Figma Frame链接,它帮你转成代码
  • Generate Figma design:直接发指令,它帮你在Figma新建文件,画好界面,同时生成对应的代码。
根据设计稿链接生成代码

修改设计稿后,回到CodeX,输入 Inspect a Figma design and implement it in code:Figma Frame链接,生成一个本地的预览地址,就可以查看是否调整,再进行细节优化和调整。

根据设计稿XML和效果图生成代码

Figma Mcp 调用次数不够时,可以通过设计稿XML和效果图来调整页面,节省Mcp的调用次数:

  • 安装 Figma 插件 FigML - Figma XML Exporter Plugin
  • 导出XML结构文件和PNG效果图
  • 回到CodeX,上传XML结构文件和PNG效果图,简单描述,调整页面代码
相关推荐
limuyang27 小时前
我在 2核2G 云主机上跑 OpenViking:一次关于云主机、模型选型与长期成本的真实复盘
人工智能·开源·ai编程
金銀銅鐵10 小时前
[Java] 用 CLI 展示 EnumMap 增删键值对时的内部变化
java·源码·ai编程
李剑一13 小时前
没收用户的钱冲史上最大IPO?2 万亿美元的估值有多少是罚没来的
aigc·openai·ai编程
张益达Yida14 小时前
我把 0.6B 大模型塞进安卓手机:596 秒到 10 秒
ai编程
小虎AI生活15 小时前
腾讯 Buddy One 架构解读:跨应用 Agent 底座怎么打通办公协同
aigc·ai编程
ZhengEnCi16 小时前
Agent 如何进行工具调用:从一次 Function Calling 到生产级工具编排的完整链路
llm·agent·ai编程
熊猫钓鱼>_>17 小时前
四种书签,一条时间线:一个读书 App 的记忆颗粒与它的边界案例【鸿蒙心迹】
开发语言·华为·ai编程·harmonyos·鸿蒙·openharmony·鸿蒙pc
yz_aiks18 小时前
WorkBuddy 使用技巧:Claude Code 国内平替,签到免费用、自动签到和手机远程控制电脑
人工智能·ai编程·效率工具·claude code·workbuddy
星际码仔18 小时前
Codex Co²:AI 时代的结对编程,应该是怎样的?
openai·ai编程·vibecoding
时早玖沐20 小时前
KOOK「找不到语音频道」:同一个错误假设,我犯了三次
python·开源·ai编程