文档菜单 · agent 能拿到什么
语言 简体中文

agent 能拿到什么

一个 frame,一个 zip。有可据以构建的结构、可直接使用的素材,以及用来比对的图片。

frame.zip
├── context.md                Start here: instructions for your agent
├── design/
│   ├── nodes.json            Layout, text, styles and expanded instances
│   ├── fonts.json            Font faces the visible text uses, with node ids
│   └── variables.json        Bound variables, collections, modes and aliases
├── assets/                   Image fills, SVGs and composited node renders
├── assets.json               Maps design references to asset files
├── references/screen.png     A render of the frame to compare against
├── missing-assets.json       Anything that could not be produced
└── manifest.json             File roles, media types, sizes and SHA-256 hashes

只需要其中一部分?CLI 可以直接完成:

npx -y @runkids/figlens find design.fig "login" --type FRAME     # 按名称或文字查找 frame id
npx -y @runkids/figlens inspect design.fig 12:345                 # 精简的布局与文字摘要
npx -y @runkids/figlens nodes design.fig 12:345 > frame.json      # REST 格式 JSON
npx -y @runkids/figlens export design.fig 12:345 icon.svg         # SVG、PNG、JPG、WebP 或 AVIF
npx -y @runkids/figlens bundle design.fig 12:345 frame.zip        # 上面的 zip

SVG 导出会嵌入原始图片填充,并把文字转为字形轮廓,因此不需要字体。通过 MCP,光栅导出也会以内联图片返回,agent 无需打开文件就能看到设计。

与 Figma 有多接近?

以 Figma 自身的 JSON、PNG 和 SVG 导出为基准,在 826 个正式设计 frame 和五个 Community 文件上测量(2026-10-22):

检查项 结果
节点结构、名称、可见性、边界和文字 771 / 826 个 frame 完全一致
原始图片填充 2,608 / 2,608 字节完全一致
SVG 素材 5,014 / 5,197 在像素差异阈值内
Community frame bundle 306 / 306 无缺失素材

这是对上述文件的结果,不保证适用于每个设计。方法和阈值:准确度报告。

本页内容取自仓库中的 docs/README-zh-CN.md。