SuperAPI AI 工具集

figma-capture-extension

设计与创作

查看项目

更新于 10-16 00:20

技能介绍

用途:这是一个 Chrome 扩展,把任意网页抓取为 Figma 的剪贴板格式,在写入剪贴板前做后处理,便于直接粘贴进 Figma 使用。

主要能力:中日韩文字检测并重映射为 PingFang SC / Noto Serif SC;通过可配置的 font-map.json 重映射不可用字体;对未指定字体的元素回退到 Noto Sans SC;扁平化不产生视觉效果的包裹元素;移除零尺寸元素和无子节点的容器;隔离工具栏点击事件,避免影响宿主页面行为。

使用方式:先从 Figma 公共端点下载 capture.js(通过 make 执行 curl -o capture.js https://www.figma.com/community/plugin/1159123024924461424/capture.js),再执行 cp font-map.example.json font-map.json 配置字体映射,然后在 chrome://extensions 开启开发者模式并“加载已解压的扩展程序”。使用时进入目标网页,点扩展图标或按 Alt+Shift+F 捕获整页或用工具栏点选元素,切到 Figma 后按 Ctrl+V(Windows)或 Cmd+V(Mac)粘贴。快捷键可在 chrome://extensions/shortcuts 修改。

适用场景:需要把网页界面搬进 Figma 做还原、改稿或设计参考时。

限制:依赖 Figma 未公开的剪贴板格式,可能失效;目标字体需已安装在 Figma 中;部分网站的 CSP 会阻止扩展脚本注入;可能无法捕获懒加载或 JavaScript 渲染的动态内容;capture.js 的下载端点可能被 Figma 更改或移除。