Figma ships code layers and motion tools in latest update

Figma shipped a platform update this week adding code layers and motion tools to its design application, NewsBytes reported. The two additions sit at the intersection of two persistent gaps in product workflows: the trip from a Figma file to production code, and the gap between static designs and the motion that ships with most modern interfaces.

What's actually new

Two additions in one release:

• Code layers — lifts markup properties (CSS values, autolayout constraints, variable bindings) from the Inspect side panel into the file's main layer tree, addressable as their own objects.
• Motion tools — introduces timeline-based animation with keyframes, easing curves, and event triggers on hover, click, scroll, or page load.

What does this change for handoff?

Code layers mean structural markup is no longer buried in computed properties. Designers and developers can name, group, and comment on CSS-driven layers the same way they handle text and frame layers.

Think of it as the difference between reading a finished spec sheet and reading the actual blueprint. Both describe the same building. Only one tells you where the load-bearing walls sit.

Why is motion the harder gap?

Motion prototyping has lagged behind static design in most product tools. Click-to-click Smart Animate transitions cover simple state changes, but they cannot easily express scroll-driven reveals, loading choreography, or the easing curves that distinguish a polished product from a flat one. Designers either skipped that work or moved to a dedicated tool.

A native timeline brings Figma closer to how After Effects or Rive handle animation. For teams already living in Figma, that removes a tool switch and keeps the static and animated versions of a design in one file.

Why ship them together?

The pairing is strategic. Code layers speak to engineers; motion tools speak to designers and product teams. By shipping them in the same release, Figma positions its file format as the canonical deliverable across the whole workflow — not the exported spec, not the prototype link, not the side motion project.

The longer a file holds its shape through handoff, the more central Figma becomes to the team that owns it.

What should teams do next?

Designers already using Figma will see the update through the standard release channel. Existing files remain compatible; the new tools appear alongside the existing layer and prototyping panels rather than replacing them.

Teams that have built motion or markup workarounds around Smart Animate and Inspect now have native alternatives to retire.

If Figma holds the file's shape across both handoff surfaces, the company extends its hold on the designer's screen well past the designer's deadline.