☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜
可借助figma原生export settings配合结构化命名、rename it插件、页面分组、anima/image exporter插件及figma api实现高效分类批量导出。
如果您在figma中完成设计后需将大量切图按图层、页面或命名规则导出为本地文件,但手动逐个设置导出参数效率低下,则可借助figma原生的export settings功能配合结构化命名与批量操作实现高效分类导出。以下是实现该目标的具体步骤:
一、为图层/组件统一配置Export Settings
导出前需确保每个需导出的图层、组件或帧已明确指定导出格式、缩放比例及命名前缀,Figma将依据这些设置在批量导出时自动应用对应参数。
1、在左侧图层面板中选中目标图层(支持多选,按住Shift或Ctrl/Cmd点击)。
2、在右侧属性检查器(Properties Panel)底部找到Export区域,点击+ Add export setting按钮。
3、从下拉菜单选择导出格式(如@1x PNG、@2x JPG、SVG),并设置缩放值(如0.5x、2x)。
4、在导出设置右侧输入Name prefix,例如输入icon-或screen-home-,该前缀将自动附加到导出文件名前。
二、使用Rename It插件批量规范图层命名
导出文件名默认继承图层名称,若图层名混乱或无意义,将导致导出后难以识别归属。通过Rename It插件可基于图层类型、父级结构或自定义规则批量重命名,为后续分类提供基础。
1、在Figma顶部菜单栏点击Plugins → Search plugins → 输入“Rename It”并安装。
2、选中需重命名的图层组,运行插件,选择模板如"Page Name + Layer Name"或"Type + Index"。
3、点击Apply,所有选中图层将按规则更新名称,例如原名为“Rectangle 1”的图层变为“icons-arrow-left”。
三、通过Pages组织切图并分页导出
Figma支持按页面(Page)划分内容,将不同类别切图分别置于独立页面(如“Icons”、“Screens”、“Logos”),可利用页面级导出能力实现天然分类。
1、在左侧页面列表右键空白处,选择Create page,命名为对应类别(如Assets-Icons)。
2、将相关图层拖入该页面,确保每个页面内仅含一类资源。
3、右键该页面标签,选择Export all layers in page,系统将导出该页所有已设Export Settings的图层,并自动以页面名为根目录生成文件夹。
四、运行Anima或Image Exporter插件一键批量导出
原生Figma不支持跨页面一键导出全部带设置图层,需依赖插件聚合所有导出项并按命名规则写入本地文件系统,避免重复操作。
1、安装插件:Plugins → Search → “Anima” 或 “Image Exporter” → Install。
2、打开插件面板,勾选“Include layers with export settings only”选项。
3、设置导出路径、文件夹结构(如按Page分组、按Name prefix建子目录)、是否覆盖同名文件。
4、点击Export All,插件将遍历全部页面,收集所有含Export Settings的图层,按前缀与页面名自动创建嵌套文件夹并保存文件。
五、通过Figma API + Python脚本实现完全自动化分类导出
对高频、大规模产出场景,可调用Figma REST API获取文件结构元数据,结合本地脚本解析图层Export Settings与命名,生成严格匹配业务目录规范的文件树。
1、在Figma文件右上角点击File → Show project ID,复制6位ID(如abc123)。
2、使用curl或Python requests请求API端点:https://api.figma.com/v1/files/{file_id},携带Bearer Token认证头。
3、解析返回JSON中的nodes字段,筛选出has_export_settings=True且name匹配正则模式(如^icon-.+\.svg$)的图层。
4、根据node.parent.name与layer.name拼接路径,调用Figma image endpoint批量下载,并保存至本地路径如./export/icons/arrow-left.svg。











