Motion System

Motion System lets you use motion design elements from the Figma plugin's System tab. You can create a motion system library from the plugin, then apply or edit supported items in the sections that already exist in that system. Full section setup and deeper system management happen in the web Motion System dashboard; detailed preset creation happens in Lottie Creator.

If you've used color styles or variables in a Figma design system, Motion System extends the same idea to animation work. Named colors, font styles, easing curves, presets, and shared assets become reusable items you can apply to selected Figma layers or use when preparing animation previews.

Motion System does not replace the plugin's export formats. Files prepared with a motion system can still be downloaded through the export formats available in the plugin, such as Lottie JSON, dotLottie, and MOV.

In this chapter

• Motion System basics — concepts: what's a system, what's a section, what's an item, how lifecycle works.

• Editing sections — adding, modifying, and organizing the design items inside a system.

• Motion System panel controls — UI reference.

When to use Motion System

• You're shipping multiple Lotties that should share a visual language (brand colors, signature easing curves).

• You want to apply shared colors and font styles to Figma layers without recreating them per file.

• You want to prepare selected frames or prototype flows with a shared easing curve or motion preset.

• You want reusable collection assets that can be inserted from the plugin.

Related

• Workspace — Motion Systems are saved to the workspace; that's where they're discoverable across team members.

• Choosing an output format — Motion System work can still use the plugin's existing download formats.