Skip to main content

LottieFiles adds Lottie export for Figma Motion

By Steven Van ·

A beta update to the LottieFiles plugin converts Figma Motion keyframes, including springs and easing, straight into Lottie or dotLottie files.

Figma Motion gives designers a real timeline for keyframe animation right inside Figma — but it has one glaring gap: it cannot export to Lottie, the lightweight JSON format the web and mobile actually run on. LottieFiles decided not to wait for Figma to close that gap and shipped the missing bridge itself. As of this week, the LottieFiles plugin reads your Figma Motion keyframes and exports them straight to a Lottie file you can ship anywhere.

The gap Figma Motion left open

Figma Motion is powerful for designing animation — spring physics, easing curves, and a familiar timeline — but the output stays trapped in Figma. There is no built-in way to hand a developer a production animation asset. Historically that meant re-building your motion by hand in After Effects or another tool just to produce a Lottie, a slow and error-prone round trip. Designers loved animating in Figma but hated that the last mile back to code did not exist.

What LottieFiles now exports

The new Figma Motion export lives inside the LottieFiles plugin (rolled out at the end of June 2026 as a beta). The plugin's Animate feature now reads your Figma Motion keyframes directly and converts them to Lottie or dotLottie. Coverage includes transform, opacity, stroke width, fill and stroke color, and trim-path draw-on effects. Easing is preserved across cubic-bezier, named, and hold curves, and spring animations are baked into keyframes so they play back faithfully outside Figma. In practice, you design the motion, click export, and receive a file that renders identically on the target platform.

Why the Lottie format matters here

Lottie is a JSON-based animation format that renders natively on web, iOS, and Android at tiny file sizes and stays crisp at any resolution. That is why it became the industry standard for micro-interactions, onboarding flows, and loading states. Getting Figma Motion output into Lottie means designers can stay in one tool for the creative work and still hand engineers something that drops straight into a Lottie player SDK — no manual re-animation, no format guesswork.

A cleaner design-to-code handoff

The value is workflow, not novelty. A designer animates in Figma, exports a Lottie from the LottieFiles plugin, and a developer ships it via the web, iOS, or Android player. LottieFiles has already patched early rough edges — a July 1 update fixed the Animate preview occasionally not auto-playing after long sessions and frames with prototype interactions exporting as static images. If you already animate in Figma, this removes the single biggest reason you had to leave it.

LottieFiles
LottieFiles
Create, manage and implement lightweight animations across websites, apps, presentations, social and more.
View LottieFiles →

Sources: LottieFiles plugin on Figma Community, LottieFiles for Figma, Using Figma to Lottie (LottieFiles Help).

Read LottieFiles adds Lottie export for Figma Motion on Creators Toolbox