Figma 转 Lottie
Figma 动画转 Lottie
在 Figma 里做了动画(Figma Motion / Smart Animate)?导出为 SVG、WebM 或 GIF,在浏览器里转成开发能直接用的 Lottie —— 免费、本地处理、尽量输出矢量,文件不上传。
SVG → 真矢量 Lottie支持 WebM / GIF100% 本地无需注册
为什么把 Figma 动画转成 Lottie?
Figma 可把动效导出为动画 SVG、WebM 或 GIF。EasyLottie 会把 CSS 动画 SVG 转成矢量 Lottie，并在本地保留 SMIL SVG 时间轴生成透明帧；WebM 与 GIF 也可在同一流程继续转换。
如何把 Figma 动画转成 Lottie
- 1从 Figma 导出把动画/原型导出为动画 SVG(或 WebM / GIF)。
- 2拖进来把文件拖到上方工具里,全程浏览器本地处理。
- 3得到矢量 Lottie动画 SVG 会转成真矢量 Lottie 并实时预览;WebM/GIF 转到 视频 → Lottie 转换器。
- 4下载使用下载 .json 放进你的 Web/App 项目 —— 无需 After Effects。
SVG color editing
只想给 Figma SVG 改个色?
免费修改 Figma 导出的动画 SVG 颜色 —— 自动检测每个颜色,实时预览(保留动画)替换,然后下载。
打开 SVG 改色工具常见问题
可以免费把 Figma 动画转成 Lottie 吗?
可以。EasyLottie 免费把 Figma 动画导出(SVG/WebM/GIF)转成 Lottie,全程浏览器本地处理,无需注册、不上传。
SVG 能转成真矢量 Lottie 吗?
能。动画 SVG(Figma 的 CSS @keyframes 导出)会被编译成真矢量 Lottie —— 体积小、分辨率无关,不是栅格套壳。
WebM 或 GIF 导出怎么办?
WebM/GIF 是栅格视频,请用我们的 视频 → Lottie 转换器(支持 MP4/MOV/WebM/GIF 及图片序列)。
文件会被上传吗?
不会。所有转换都在你的浏览器本地完成,设计稿不离开你的电脑。
相关工具
Guide: How to convert a Figma animation to Lottie (without After Effects) →