@Figma Motion adds timeline-based animation to the same canvas where the rest of your design already lives.
You can create keyframes, apply preset animation styles, use the Figma agent for a starting point, and then edit the motion directly on the timeline.
Dev Mode can show the full timeline, including timing values, easing curves, and keyframes. You can also copy CSS, JSON, React, or motion.dev code directly from the panel.
It is also MCP-compatible, so a coding agent can receive an animated frame with the motion context instead of guessing from a video or a written spec.
Figma Motion launched on Product Hunt on June 25th, 2026 and earned 217 upvotes and 8 comments, placing #4 on the daily leaderboard. Motion now lives on the canvas—in the same file as your components, your variables, and your team—so your designs can come to life from day one.
On the analytics side, Figma Motion competes within Design Tools, User Experience and Graphics & Design — topics that collectively have 631.4k followers on Product Hunt. The dashboard above tracks how Figma Motion performed against the three products that launched closest to it on the same day.
Who hunted Figma Motion?
Figma Motion was hunted by Zac Zuo. A “hunter” on Product Hunt is the community member who submits a product to the platform — uploading the images, the link, and tagging the makers behind it. Hunters typically write the first comment explaining why a product is worth attention, and their followers are notified the moment they post. Around 79% of featured launches on Product Hunt are self-hunted by their makers, but a well-known hunter still acts as a signal of quality to the rest of the community. See the full all-time top hunters leaderboard to discover who is shaping the Product Hunt ecosystem.
Zac Zuo
Hi everyone!
@Figma Motion adds timeline-based animation to the same canvas where the rest of your design already lives.
You can create keyframes, apply preset animation styles, use the Figma agent for a starting point, and then edit the motion directly on the timeline.
Dev Mode can show the full timeline, including timing values, easing curves, and keyframes. You can also copy CSS, JSON, React, or motion.dev code directly from the panel.
It is also MCP-compatible, so a coding agent can receive an animated frame with the motion context instead of guessing from a video or a written spec.
Figma also shipped a lot more at Config 2026!