Motion - Animation for Figma
Animate your designs, export to video / GIF / APNG / SVG, handoff with developers
Plugin Preview
About this plugin
Motion is the ultimate animation tool for Figma
π¬ Animate mobile apps, websites, landing pages, micro-interations
π¬ Animate social media, videos, ads
π Work on your canvas in Figma in real-time (no need to switch to another window)
π Export as Video, GIF, APNG, SVG, and more
π€ Share animations with your team
π§βπ Support available 24/7
More than 300,000 users already us it! π
Join us!
π‘ How to use it
There are three ways to animate, and you can mix them however you like!
1. Automatic recording of all canvas changes
Turn on the "Record" button in Motion and follow the instructions.
2. Using animation presets
Select a layer, and the presets panel will appear in Motion. Choose any preset you like.
3. Manual animation
Use keyframes, paths, and links for advanced animations.
Check our documentation for more details.
π Documentation
π¦ Features
For Beginners and Professionals
Whether you're a beginner or a professional, Motion is a powerful and easy-to-use tool. It offers various animation tools, allowing you to choose the one that suits your needs for any type of animation.
Automatic Recording
Record your animation with just a few clicks. Turn on the option, make changes on the canvas, move the time handle forward, make more changes, and click play to see the result.
Animation presets
Choose from nearly 100 ready-made animation presets for quick and easy motion effects.
Keyframes
Animate almost any layer property with precise keyframe control.
Paths
Move objects along a custom path for smooth animations.
Links
Create advanced animations with depenedent objects.
Export to Multiple Formats
Save your animations as GIF, Video, APNG, SVG, and more.
Team Collaboration
Share your Figma file with edit permissions to let your team view and play animations.
πββοΈ FAQ
What can I animate with Motion?
The short answer is literally everything. There are no limits. You can animate interfaces, apps, websites, landing pages, promo videos, games, social media, micro-interactions, ads, Instagram stories, and YouTube shorts. The possibilities are endless!
Why Motion and not other tools?
Motion is one of the most powerful animation tools for Figma. Plus, you never have to leave Figmaβno switching windows or syncing with external apps. It's seamless and efficient!
What is Automatic Recording?
Create animations just like designing! Move the time handle, make changes in Figma, and repeat. Motion records everythingβjust hit Play when you're done!
Which export formats does Motion support?
- GIF β Great for short, looping animations.
- Video (MP4/WebM) β High quality, small file size, ideal for social media.
- APNG β Animated PNG with full transparency.
- Animated SVG β Best for web animations.
- CSS β Lightweight animations for websites.
- JSON β Perfect for developers.
- PNG Sprite β A sequence of frames in one file.
- PNG Frames β Individual frames for custom use.
How do I share animations with my team?
Anyone with edit access to your file can view and modify animations. To prevent changes, you can lock animations for other users.
What should I do if I have a problem?
You can always reach out via email or any of our social media channels. We strive to assist our users 24/7.
π Contact
You can always reach out to us at [email protected].
Plugin Details
Version | 522 |
---|---|
Created | September 21, 2020 |
Last Updated | April 5, 2025 |
Category | Prototyping & animation plugins |
Creator | Pavel Babkin |
Stats | 142592 installs, 4399 likes |
Pricing | Paid |
Technical Details
- API:1.0.0
- UI:dist/ui.html
- main:dist/code.js
- Document Access:dynamic-page
- Editor Types:figma
- Allowed Domains:
- https://*.figma.com
- https://motionplugin.com
More Like This
Discover other plugins in the Prototyping & animation plugins category.