Agent 拿到什麼

一個 frame，一個 zip。有可依循的結構、可使用的素材，以及可供比對的圖片。

frame.zip
├── context.md                從這裡開始：給你的 agent 的說明
├── design/
│   ├── nodes.json            排版、文字、樣式與展開後的 instance
│   ├── fonts.json            可見文字用到的字型與節點 ID
│   └── variables.json        綁定的 variables、collection、mode 與 alias
├── assets/                   圖片填色、SVG 與合成後的節點渲染圖
├── assets.json               將設計中的參照對應到素材檔案
├── references/screen.png     供比對的 frame 渲染圖
├── missing-assets.json       所有無法產生的項目
└── manifest.json             檔案角色、媒體類型、大小與 SHA-256 雜湊

只需要其中一項？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 匯出會內嵌原始圖片填色，並將文字轉為 glyph 外框，因此不需要字型。透過 MCP 時，點陣圖匯出也會以內嵌圖片回傳，agent 不必開啟檔案就能看到設計。

與 Figma 有多接近？

以 Figma 自己的 JSON、PNG 與 SVG 匯出為基準，在 826 個正式環境 frame 與五個 Community 檔案上測量（2026-10-22）：

檢查項目	結果
節點結構、名稱、可見性、邊界與文字	826 個 frame 中有 771 個完全一致
原始圖片填色	2,608 / 2,608 位元組完全一致
SVG 素材	5,014 / 5,197 在像素差異門檻內
Community frame bundle	306 / 306 沒有缺少素材

這是在這些檔案上的結果，不保證每個設計都如此。方法與門檻：精確度報告。