{"id":361,"date":"2023-06-15T05:53:38","date_gmt":"2023-06-15T05:53:38","guid":{"rendered":"https:\/\/magicul.io\/blog\/?p=361"},"modified":"2023-10-07T12:03:40","modified_gmt":"2023-10-07T12:03:40","slug":"how-to-export-gifs-from-figma-3-different-ways","status":"publish","type":"post","link":"https:\/\/magicul.io\/blog\/how-to-export-gifs-from-figma-3-different-ways","title":{"rendered":"How to Export GIFs from Figma: 3 Different Ways"},"content":{"rendered":"\n<p>Did you just ask yourself &#8220;Can I export GIF from Figma&#8221;? Maybe you wanted to export a smooth Smart Animate animation from Figma to GIF? As a designer we&#8217;ve probably all been there. GIF isn&#8217;t the format of the future, yet the marketing folks can&#8217;t without it. So let&#8217;s get to the bottom of it. This post will walk you through different methods of how to export GIF from Figma. We will also take a look at what pros and cons each method has and what makes sense for your given scenario. After all there&#8217;s so many different reason you might want to export a Figma animation as a GIF. <\/p>\n\n\n\n<p>Here&#8217;s a few use-cases why you&#8217;d want to export your Figma as GIF:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Animated marketing material for banners<\/li>\n\n\n\n<li>A prototype for a developer handoff to show-case how hover effects work<\/li>\n\n\n\n<li>Animated animation to integrate into a website (even though <a href=\"https:\/\/airbnb.design\/lottie\/\" target=\"_blank\" rel=\"noreferrer noopener\">Lottie<\/a> might be the way to go here!).<\/li>\n\n\n\n<li>&#8230; Or maybe you&#8217;re a fancy and funny GIF creator<\/li>\n<\/ul>\n\n\n\n<p>Anyhow, without more chitter chatter lets dig into it.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-method-1-use-the-figma-gif-export-plugin\">Method 1: Use the Figma GIF Export Plugin<\/h2>\n\n\n\n<p>The simplest way to export animated GIFs from Figma is with the GIF Export plugin. Here&#8217;s how to do it:<\/p>\n\n\n\n<p>Step 1: Log into your Figma account and go to the &#8220;Community&#8221; section.<br>Step 2: Search for &#8220;<a href=\"https:\/\/www.figma.com\/community\/plugin\/878338850782783595\/GIF-Export\" target=\"_blank\" rel=\"noreferrer noopener\">GIF Export<\/a>&#8221; and install the plugin.<br>Step 3: Open the design you want to save as a GIF and launch the Export GIF Plugin<br>Step 4: Click the &#8220;Export GIF&#8221; button and select the layers on your Figma canvas to act as frames of your GIF.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/magicul.io\/blog\/wp-content\/uploads\/2023\/06\/gif-export-plugin-figma-1024x1018.jpg\" alt=\"\" class=\"wp-image-363\" style=\"width:764px;height:759px\" width=\"764\" height=\"759\" srcset=\"https:\/\/magicul.io\/blog\/wp-content\/uploads\/2023\/06\/gif-export-plugin-figma-1024x1018.jpg 1024w, https:\/\/magicul.io\/blog\/wp-content\/uploads\/2023\/06\/gif-export-plugin-figma-300x298.jpg 300w, https:\/\/magicul.io\/blog\/wp-content\/uploads\/2023\/06\/gif-export-plugin-figma-150x150.jpg 150w, https:\/\/magicul.io\/blog\/wp-content\/uploads\/2023\/06\/gif-export-plugin-figma-768x764.jpg 768w, https:\/\/magicul.io\/blog\/wp-content\/uploads\/2023\/06\/gif-export-plugin-figma-1536x1527.jpg 1536w, https:\/\/magicul.io\/blog\/wp-content\/uploads\/2023\/06\/gif-export-plugin-figma-2048x2037.jpg 2048w\" sizes=\"auto, (max-width: 764px) 100vw, 764px\" \/><figcaption class=\"wp-element-caption\">Figma Plugin to Export as GIF<\/figcaption><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-method-2-screen-recording-for-web\">Method 2: Screen recording for Web<\/h2>\n\n\n\n<p>You can make a screen recording of your animations in Figma and convert this into a GIF using any free online tool. Here&#8217;s an example how you could do that:<\/p>\n\n\n\n<p>Step 1: Open your Figma design and play the Figma prototype<\/p>\n\n\n\n<p>Step 2: Start the MacOS QuickTime app<\/p>\n\n\n\n<p>Step 3: Start a recording in QuickTime just for the particular section of the screen where your Figma prototype is playing. Go to &#8220;File&#8221; &gt; &#8220;New Screen Recording&#8221;.<\/p>\n\n\n\n<p>Step 4: Export the Figma recording as an MOV file<\/p>\n\n\n\n<p>Step 5: Convert the MOV file using an online service like <a href=\"https:\/\/ezgif.com\/video-to-gif\" target=\"_blank\" rel=\"noreferrer noopener\">EZGif<\/a> to convert MOV files to GIFs. <\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-method-3-screen-recording-for-mobile-prototypes\">Method 3: Screen Recording for Mobile Prototypes<\/h2>\n\n\n\n<p>If you&#8217;re working on a mobile design chances are you want to export a prototype as GIF. Here&#8217;s a quick workaround to record your animations on a mobile device and save them as a GIF. This requires you to have the Figma mobile mirror app installed on your iPhone or Android phone.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/magicul.io\/blog\/wp-content\/uploads\/2023\/06\/figma-mirror-app-591x1024.jpg\" alt=\"\" class=\"wp-image-362\" style=\"width:316px;height:548px\" width=\"316\" height=\"548\" srcset=\"https:\/\/magicul.io\/blog\/wp-content\/uploads\/2023\/06\/figma-mirror-app-591x1024.jpg 591w, https:\/\/magicul.io\/blog\/wp-content\/uploads\/2023\/06\/figma-mirror-app-173x300.jpg 173w, https:\/\/magicul.io\/blog\/wp-content\/uploads\/2023\/06\/figma-mirror-app.jpg 748w\" sizes=\"auto, (max-width: 316px) 100vw, 316px\" \/><figcaption class=\"wp-element-caption\">Figma Mirror app to record mobile designs as GIF<\/figcaption><\/figure>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Open <a href=\"https:\/\/figma.com\/mirror\" target=\"_blank\" rel=\"noreferrer noopener\">https:\/\/figma.com\/mirror<\/a> on your phone<\/li>\n\n\n\n<li>Screen record the Figma app on your device, capturing the design you wish to convert into a GIF<\/li>\n\n\n\n<li>On iPhone, for example, go to &#8220;Settings,&#8221; select &#8220;Control Center,&#8221; enable &#8220;Screen Recording,&#8221; and then record your design\u200b<\/li>\n\n\n\n<li>Use an app like Shortcuts on iPhone to convert your screen recording into a GIF\u200b<\/li>\n<\/ol>\n\n\n\n<p>This method is particularly useful for showcasing Figma prototypes with advanced animations like sliding tabs, swiping options, and drop-down menus.<\/p>\n\n\n\n<p><\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-people-also-ask\">People Also Ask:<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>How do you export animated videos from Figma?<\/strong><\/h3>\n\n\n\n<p>Figma doesn&#8217;t natively support exporting animations as videos. However, a common workaround is to screen record the animation as it plays in Figma and then save that recording as a video file. For instance, you can use the MacOS QuickTime app to record a specific section of your screen where the Figma prototype is playing. After recording, you can export the Figma recording as an MOV file. If you&#8217;re working on mobile designs, you can use the <a href=\"https:\/\/figma.com\/mirror\">Figma Mirror app<\/a> to record animations on a mobile device.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>How do I export an animated GIF?<\/strong><\/h3>\n\n\n\n<p>To export an animated GIF from Figma, you can use the <strong>Figma GIF Export Plugin<\/strong>. Here&#8217;s a brief guide:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Log into Figma and go to the &#8220;Community&#8221; section.<\/li>\n\n\n\n<li>Search for &#8220;GIF Export&#8221; and install the plugin.<\/li>\n\n\n\n<li>Open your design and launch the Export GIF Plugin.<\/li>\n\n\n\n<li>Click &#8220;Export GIF&#8221; and select the layers to act as frames for your GIF. For more details, check out <a href=\"https:\/\/magicul.io\/tutorials\/open-xd-file-principle\">Magicul&#8217;s tutorials<\/a>.<\/li>\n<\/ol>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>How do I export frames from Figma to the image?<\/strong><\/h3>\n\n\n\n<p>To export frames from Figma as images, select the frame or element you want to export, then choose the export option and select the desired image format (e.g., JPEG, PNG). If you&#8217;re looking for advanced export options, <a href=\"https:\/\/magicul.io\/converter\/figma-to-xd\">Magicul&#8217;s converters<\/a> can be a valuable resource.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Can you export Figma prototypes?<\/strong><\/h3>\n\n\n\n<p>Yes, you can export Figma prototypes, but not directly as standalone interactive files. Instead, you can share a link to the prototype or record the prototype&#8217;s interactions and export them as videos or GIFs. If you&#8217;re looking to convert Figma designs to other formats or tools, <a href=\"https:\/\/magicul.io\/\">Magicul.io<\/a> offers a range of conversion tools to assist.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-frequently-asked-questions\">Frequently Asked Questions:<\/h2>\n\n\n\n<p><strong>Q: Is there a direct Figma GIF Exporter?<\/strong><\/p>\n\n\n\n<p>Simple answer: No there isn&#8217;t. But there are plenty of workarounds through plugins, screen recording and so on.<\/p>\n\n\n\n<p><strong>Q: Can you export MP4 from Figma?<\/strong><\/p>\n\n\n\n<p>No, Figma doesn&#8217;t allow you to export animations as MP4 files. You can record your screen and then convert a MOV file to MP4 as a workaround.<\/p>\n\n\n\n<p><strong>Q: Are there any limitations in terms of file size when exporting GIFs from Figma?<\/strong><\/p>\n\n\n\n<p>Yes, there can be. Depending on the method you&#8217;re using to export the GIF, there might be limitations on the file size. For instance, some online tools for converting videos to GIFs have maximum file size restrictions. If you&#8217;re using a Figma plugin, check the specific details of that plugin for any limitations.<\/p>\n\n\n\n<p><strong>Q: Can I control the speed of the animation when exporting a GIF from Figma?<\/strong><\/p>\n\n\n\n<p>Yes and no. Within Figma, you can control the speed of your prototype animations using the Smart Animate feature. However, when you export these as GIFs, the speed of the animation will be captured as it is played in Figma. If you want to change the speed of the GIF after exporting, you&#8217;ll need to use a separate tool or software that allows you to adjust the speed of GIF animations.<\/p>\n\n\n\n<p><strong>Q: What is the expected file size of the GIF after exporting from Figma?<\/strong> <\/p>\n\n\n\n<p>The file size of the exported GIF will depend on several factors, including the length of the animation, the dimensions of the frames, the number of colors, and the complexity of the images. In general, GIFs can be larger in file size compared to other video formats due to their frame-by-frame animation method. If file size is a concern, consider optimizing your GIF with tools that can reduce the number of colors, apply dithering, or adjust the dimensions.<\/p>\n\n\n\n<p><strong>Q: Can I export animations created with Figma&#8217;s Smart Animate feature as GIFs?<\/strong><\/p>\n\n\n\n<p>Figma doesn&#8217;t natively support exporting Smart Animate animations as GIFs. However, you can use workarounds like screen recording the animation as it plays in Figma and then converting that recording to a GIF. It&#8217;s important to note that the resulting GIF will capture the animation as it appears on screen, including the speed and timing of the Smart Animate transitions.<\/p>\n\n\n\n<p><strong>Q: Do all Figma plugins support exporting Smart Animate animations as GIFs?<\/strong><\/p>\n\n\n\n<p>Not necessarily. Some Figma plugins may not fully support animations created with the Smart Animate feature. If you&#8217;re using a plugin, make sure to check the documentation or ask the plugin developer to confirm what types of animations it supports.<br><br><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Did you just ask yourself &#8220;Can I export GIF from Figma&#8221;? Maybe you wanted to export a smooth Smart Animate animation from Figma to GIF? As a designer we&#8217;ve probably all been there. GIF isn&#8217;t the format of the future, yet the marketing folks can&#8217;t without it. So let&#8217;s get to the bottom of it. [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":365,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_swt_meta_header_display":false,"_swt_meta_footer_display":false,"_swt_meta_site_title_display":false,"_swt_meta_sticky_header":false,"_swt_meta_transparent_header":false,"footnotes":""},"categories":[23,5],"tags":[17],"class_list":["post-361","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-figma-guides","category-guides","tag-figma"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v23.0 (Yoast SEO v27.4) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>How to Export GIFs from Figma: 3 Different Ways - Magicul Blog<\/title>\n<meta name=\"description\" content=\"Discover how to seamlessly export animated GIFs from Figma with our detailed guide. Unlock the potential of your designs with dynamic animations.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/magicul.io\/blog\/how-to-export-gifs-from-figma-3-different-ways\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Export GIFs from Figma: 3 Different Ways\" \/>\n<meta property=\"og:description\" content=\"Discover how to seamlessly export animated GIFs from Figma with our detailed guide. Unlock the potential of your designs with dynamic animations.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/magicul.io\/blog\/how-to-export-gifs-from-figma-3-different-ways\" \/>\n<meta property=\"og:site_name\" content=\"Magicul Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/magicul.io\/\" \/>\n<meta property=\"article:published_time\" content=\"2023-06-15T05:53:38+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-10-07T12:03:40+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/magicul.io\/blog\/wp-content\/uploads\/2023\/06\/export-figma-as-gif-banner-scaled.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"2560\" \/>\n\t<meta property=\"og:image:height\" content=\"1280\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Kevin Goedecke\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Kevin Goedecke\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"6 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/magicul.io\\\/blog\\\/how-to-export-gifs-from-figma-3-different-ways#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/magicul.io\\\/blog\\\/how-to-export-gifs-from-figma-3-different-ways\"},\"author\":{\"name\":\"Kevin Goedecke\",\"@id\":\"https:\\\/\\\/magicul.io\\\/blog\\\/#\\\/schema\\\/person\\\/f2be27c281d0a90feb9acb12fa49cd4b\"},\"headline\":\"How to Export GIFs from Figma: 3 Different Ways\",\"datePublished\":\"2023-06-15T05:53:38+00:00\",\"dateModified\":\"2023-10-07T12:03:40+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/magicul.io\\\/blog\\\/how-to-export-gifs-from-figma-3-different-ways\"},\"wordCount\":1245,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/magicul.io\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/magicul.io\\\/blog\\\/how-to-export-gifs-from-figma-3-different-ways#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/magicul.io\\\/blog\\\/wp-content\\\/uploads\\\/2023\\\/06\\\/export-figma-as-gif-banner-scaled.jpg\",\"keywords\":[\"Figma\"],\"articleSection\":[\"Figma Guides\",\"Guides\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/magicul.io\\\/blog\\\/how-to-export-gifs-from-figma-3-different-ways\",\"url\":\"https:\\\/\\\/magicul.io\\\/blog\\\/how-to-export-gifs-from-figma-3-different-ways\",\"name\":\"How to Export GIFs from Figma: 3 Different Ways - Magicul Blog\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/magicul.io\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/magicul.io\\\/blog\\\/how-to-export-gifs-from-figma-3-different-ways#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/magicul.io\\\/blog\\\/how-to-export-gifs-from-figma-3-different-ways#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/magicul.io\\\/blog\\\/wp-content\\\/uploads\\\/2023\\\/06\\\/export-figma-as-gif-banner-scaled.jpg\",\"datePublished\":\"2023-06-15T05:53:38+00:00\",\"dateModified\":\"2023-10-07T12:03:40+00:00\",\"description\":\"Discover how to seamlessly export animated GIFs from Figma with our detailed guide. Unlock the potential of your designs with dynamic animations.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/magicul.io\\\/blog\\\/how-to-export-gifs-from-figma-3-different-ways#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/magicul.io\\\/blog\\\/how-to-export-gifs-from-figma-3-different-ways\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/magicul.io\\\/blog\\\/how-to-export-gifs-from-figma-3-different-ways#primaryimage\",\"url\":\"https:\\\/\\\/magicul.io\\\/blog\\\/wp-content\\\/uploads\\\/2023\\\/06\\\/export-figma-as-gif-banner-scaled.jpg\",\"contentUrl\":\"https:\\\/\\\/magicul.io\\\/blog\\\/wp-content\\\/uploads\\\/2023\\\/06\\\/export-figma-as-gif-banner-scaled.jpg\",\"width\":2560,\"height\":1280},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/magicul.io\\\/blog\\\/how-to-export-gifs-from-figma-3-different-ways#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/magicul.io\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How to Export GIFs from Figma: 3 Different Ways\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/magicul.io\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/magicul.io\\\/blog\\\/\",\"name\":\"Magicul Blog\",\"description\":\"The official blog of Magicul - Stuff around UI UX and design.\",\"publisher\":{\"@id\":\"https:\\\/\\\/magicul.io\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/magicul.io\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/magicul.io\\\/blog\\\/#organization\",\"name\":\"Magicul\",\"url\":\"https:\\\/\\\/magicul.io\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/magicul.io\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/magicul.io\\\/blog\\\/wp-content\\\/uploads\\\/2023\\\/05\\\/magicul-logo.png\",\"contentUrl\":\"https:\\\/\\\/magicul.io\\\/blog\\\/wp-content\\\/uploads\\\/2023\\\/05\\\/magicul-logo.png\",\"width\":260,\"height\":80,\"caption\":\"Magicul\"},\"image\":{\"@id\":\"https:\\\/\\\/magicul.io\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/magicul.io\\\/\",\"https:\\\/\\\/www.instagram.com\\\/magicul.io\\\/\",\"https:\\\/\\\/www.youtube.com\\\/channel\\\/UCWcKb64il19wHifcxsSc_2g\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/magicul.io\\\/blog\\\/#\\\/schema\\\/person\\\/f2be27c281d0a90feb9acb12fa49cd4b\",\"name\":\"Kevin Goedecke\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/6cc11f9608b46c4f1f80757b06785d8578e5ba865196d7eff114e0638943e1e5?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/6cc11f9608b46c4f1f80757b06785d8578e5ba865196d7eff114e0638943e1e5?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/6cc11f9608b46c4f1f80757b06785d8578e5ba865196d7eff114e0638943e1e5?s=96&d=mm&r=g\",\"caption\":\"Kevin Goedecke\"},\"description\":\"CEO &amp; Founder of Magicul - We help creative teams be more productive.\",\"sameAs\":[\"https:\\\/\\\/magicul.io\"],\"url\":\"https:\\\/\\\/magicul.io\\\/blog\\\/author\\\/kgoedecke\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"How to Export GIFs from Figma: 3 Different Ways - Magicul Blog","description":"Discover how to seamlessly export animated GIFs from Figma with our detailed guide. Unlock the potential of your designs with dynamic animations.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/magicul.io\/blog\/how-to-export-gifs-from-figma-3-different-ways","og_locale":"en_US","og_type":"article","og_title":"How to Export GIFs from Figma: 3 Different Ways","og_description":"Discover how to seamlessly export animated GIFs from Figma with our detailed guide. Unlock the potential of your designs with dynamic animations.","og_url":"https:\/\/magicul.io\/blog\/how-to-export-gifs-from-figma-3-different-ways","og_site_name":"Magicul Blog","article_publisher":"https:\/\/www.facebook.com\/magicul.io\/","article_published_time":"2023-06-15T05:53:38+00:00","article_modified_time":"2023-10-07T12:03:40+00:00","og_image":[{"width":2560,"height":1280,"url":"https:\/\/magicul.io\/blog\/wp-content\/uploads\/2023\/06\/export-figma-as-gif-banner-scaled.jpg","type":"image\/jpeg"}],"author":"Kevin Goedecke","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Kevin Goedecke","Est. reading time":"6 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/magicul.io\/blog\/how-to-export-gifs-from-figma-3-different-ways#article","isPartOf":{"@id":"https:\/\/magicul.io\/blog\/how-to-export-gifs-from-figma-3-different-ways"},"author":{"name":"Kevin Goedecke","@id":"https:\/\/magicul.io\/blog\/#\/schema\/person\/f2be27c281d0a90feb9acb12fa49cd4b"},"headline":"How to Export GIFs from Figma: 3 Different Ways","datePublished":"2023-06-15T05:53:38+00:00","dateModified":"2023-10-07T12:03:40+00:00","mainEntityOfPage":{"@id":"https:\/\/magicul.io\/blog\/how-to-export-gifs-from-figma-3-different-ways"},"wordCount":1245,"commentCount":0,"publisher":{"@id":"https:\/\/magicul.io\/blog\/#organization"},"image":{"@id":"https:\/\/magicul.io\/blog\/how-to-export-gifs-from-figma-3-different-ways#primaryimage"},"thumbnailUrl":"https:\/\/magicul.io\/blog\/wp-content\/uploads\/2023\/06\/export-figma-as-gif-banner-scaled.jpg","keywords":["Figma"],"articleSection":["Figma Guides","Guides"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/magicul.io\/blog\/how-to-export-gifs-from-figma-3-different-ways","url":"https:\/\/magicul.io\/blog\/how-to-export-gifs-from-figma-3-different-ways","name":"How to Export GIFs from Figma: 3 Different Ways - Magicul Blog","isPartOf":{"@id":"https:\/\/magicul.io\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/magicul.io\/blog\/how-to-export-gifs-from-figma-3-different-ways#primaryimage"},"image":{"@id":"https:\/\/magicul.io\/blog\/how-to-export-gifs-from-figma-3-different-ways#primaryimage"},"thumbnailUrl":"https:\/\/magicul.io\/blog\/wp-content\/uploads\/2023\/06\/export-figma-as-gif-banner-scaled.jpg","datePublished":"2023-06-15T05:53:38+00:00","dateModified":"2023-10-07T12:03:40+00:00","description":"Discover how to seamlessly export animated GIFs from Figma with our detailed guide. Unlock the potential of your designs with dynamic animations.","breadcrumb":{"@id":"https:\/\/magicul.io\/blog\/how-to-export-gifs-from-figma-3-different-ways#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/magicul.io\/blog\/how-to-export-gifs-from-figma-3-different-ways"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/magicul.io\/blog\/how-to-export-gifs-from-figma-3-different-ways#primaryimage","url":"https:\/\/magicul.io\/blog\/wp-content\/uploads\/2023\/06\/export-figma-as-gif-banner-scaled.jpg","contentUrl":"https:\/\/magicul.io\/blog\/wp-content\/uploads\/2023\/06\/export-figma-as-gif-banner-scaled.jpg","width":2560,"height":1280},{"@type":"BreadcrumbList","@id":"https:\/\/magicul.io\/blog\/how-to-export-gifs-from-figma-3-different-ways#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/magicul.io\/blog\/"},{"@type":"ListItem","position":2,"name":"How to Export GIFs from Figma: 3 Different Ways"}]},{"@type":"WebSite","@id":"https:\/\/magicul.io\/blog\/#website","url":"https:\/\/magicul.io\/blog\/","name":"Magicul Blog","description":"The official blog of Magicul - Stuff around UI UX and design.","publisher":{"@id":"https:\/\/magicul.io\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/magicul.io\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/magicul.io\/blog\/#organization","name":"Magicul","url":"https:\/\/magicul.io\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/magicul.io\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/magicul.io\/blog\/wp-content\/uploads\/2023\/05\/magicul-logo.png","contentUrl":"https:\/\/magicul.io\/blog\/wp-content\/uploads\/2023\/05\/magicul-logo.png","width":260,"height":80,"caption":"Magicul"},"image":{"@id":"https:\/\/magicul.io\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/magicul.io\/","https:\/\/www.instagram.com\/magicul.io\/","https:\/\/www.youtube.com\/channel\/UCWcKb64il19wHifcxsSc_2g"]},{"@type":"Person","@id":"https:\/\/magicul.io\/blog\/#\/schema\/person\/f2be27c281d0a90feb9acb12fa49cd4b","name":"Kevin Goedecke","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/6cc11f9608b46c4f1f80757b06785d8578e5ba865196d7eff114e0638943e1e5?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/6cc11f9608b46c4f1f80757b06785d8578e5ba865196d7eff114e0638943e1e5?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/6cc11f9608b46c4f1f80757b06785d8578e5ba865196d7eff114e0638943e1e5?s=96&d=mm&r=g","caption":"Kevin Goedecke"},"description":"CEO &amp; Founder of Magicul - We help creative teams be more productive.","sameAs":["https:\/\/magicul.io"],"url":"https:\/\/magicul.io\/blog\/author\/kgoedecke"}]}},"_links":{"self":[{"href":"https:\/\/magicul.io\/blog\/wp-json\/wp\/v2\/posts\/361","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/magicul.io\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/magicul.io\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/magicul.io\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/magicul.io\/blog\/wp-json\/wp\/v2\/comments?post=361"}],"version-history":[{"count":3,"href":"https:\/\/magicul.io\/blog\/wp-json\/wp\/v2\/posts\/361\/revisions"}],"predecessor-version":[{"id":879,"href":"https:\/\/magicul.io\/blog\/wp-json\/wp\/v2\/posts\/361\/revisions\/879"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/magicul.io\/blog\/wp-json\/wp\/v2\/media\/365"}],"wp:attachment":[{"href":"https:\/\/magicul.io\/blog\/wp-json\/wp\/v2\/media?parent=361"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/magicul.io\/blog\/wp-json\/wp\/v2\/categories?post=361"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/magicul.io\/blog\/wp-json\/wp\/v2\/tags?post=361"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}