如何在Figma中让背景变透明(2026年指南)
在Figma中导出透明背景的分步指南,以及在导入前更快去除照片背景的方法。
作者 nobackground team · 最后更新 2026年7月11日
Figma是为界面设计而生的,不是照片编辑工具,所以"去除背景"在这里的含义和在照片工具中不同。如果你只是想让画框或画板的背景在导出时消失,Figma原生就能做到。但如果你有一张背景杂乱的照片——产品照、人像、放置的图片——Figma没有内置方式来检测主体并将其裁剪出来;你需要插件、用钢笔工具耐心操作,或者在图片进入你的文件之前使用专门的背景移除工具。
为什么透明背景在Figma项目中很重要
透明PNG可以让你把标志、产品照片或图标叠加在任何颜色、截图样式或渐变之上,而不会出现明显的方框。这对UI套件、营销演示、应用商店截图,以及任何需要同一素材出现在多种背景上的设计系统都很重要。
方法一:导出带透明背景的画框
第一步:在Figma中选择你的画框、组或组件。
第二步:在右侧面板中,移除或隐藏画框的背景填充(点击填充色块并删除,或关闭其可见性)。
第三步:打开右侧面板底部的导出(Export)区域,选择PNG格式并导出。PNG支持alpha透明度,因此背景填充被移除的地方会导出为透明而不是白色。
这种方法适用于标志、图标和UI样图,其中"背景"只是你在Figma中添加的填充颜色,而不是拍摄的场景。
方法二:从放置的照片中移除背景
如果需要透明背景的是一张照片——产品照、人像、实物截图——Figma的导出设置无法帮上忙,因为背景不是Figma的填充,而是图片本身像素的一部分。在Figma内部,你的现实选择是使用调用外部API的社区插件,或用钢笔工具手动为主体做蒙版,这个过程缓慢,且很少能在头发、毛发或精细细节周围产生干净的边缘。
更快的方式:导入前先去除背景
对大多数设计师来说,最简单的工作流程是先去除照片的背景,然后将得到的透明PNG直接拖入Figma。将图片上传到nobackground,让设备端AI在几秒钟内裁剪出主体,下载PNG并放置到画布上——无需插件权限,无需账户,整个过程中没有任何图片离开你的浏览器。
获得干净透明导出的小技巧
- 对于将用于高密度显示屏的内容,以2倍或3倍比例导出,之后如有需要再缩小——这样可以避免裁切边缘出现柔和、模糊的现象。
- 在交付之前,将透明PNG放在棋盘格或深色背景上预览,因为在纯白画布上很容易忽略浅灰色的边缘光晕。
- 如果要将同一个裁切图放置在多个样图上,请将原始透明PNG保存为Figma库中的共享资源,而不是每次从每个画框重新导出。
关于Figma透明度的常见问题
Figma有内置的背景移除功能吗?没有。Figma可以导出带透明填充的画框或形状,但如果没有插件或外部工具,它无法自动检测并从照片中裁剪出主体。
nobackground生成的透明PNG能直接在Figma中使用吗?可以。只需将下载的PNG像其他任何图片素材一样拖放到画布上即可;透明度会被保留。