New 以 Sketch 或 XD 等独立格式自动备份您的 Figma 设计。 了解更多 >

How to convert Components from XD to Figma

Converting complex design files between XD and Figma can take days to accomplish.

If the file includes reusable Component Libraries and a Design System, then those days will quickly stretch into weeks or even months.

Our Adobe XD to Figma converter saves you time and converts even:

  • Components

  • Component Instances

  • Component Variants

  • Component Layout Properties

Magicul automates the soulless task of rebuilding your design in incompatible tools and simplifies conversions down to only a few clicks.

Table of Contents

  • A closer look at the XD to Figma conversion ✨

  • 5 Steps to convert your files from XD to Figma 🐾

  • Two features of Adobe XD we can't convert to Figma 🙅‍♀️

  • 1 free artboard conversion trial 👍

A closer look at the XD to Figma Conversion ✨

Here you see the before and after gifs of a file converted from XD to Figma. The file converted with all Components 🎉 and all of it's instances.

gif xd design demo before conversion to Figma

Now let's take a closer look at the Components converted to Figma

converted file in figma

Struggling to find Master Components in Figma after the conversion?

The master Components from XD were moved to the Symbols page during the conversion.

🔥 Hot Tip: right click - Main Component - Go to Main Component.

go to the main component in Figma button

Did you notice this?

conversion issues clip content in Figma

The conversion is fine. What we're seeing here is a difference in how Figma and XD treat certain properties.

In this case, the clip content property is true by default in XD.

If you run into any issues without an easy fix, feel free to message us in the support chat for prompt and 24/7 assistance. Or you can consult the help articles to troubleshoot for easy fixes like you see above.

Layouts and Resizing

Magicul supports frame and Component layout and resizing policies. This means that Component layout rules and tethers that we set up in XD will persist in Figma.

demonstrating layouts in Figma components

Components must retain a high degree of editability so future designers can continue to iterate or take the design in a completely different direction.

Parent/Child or Master/Instance Relationships

Magicul understands complex Component hierarchy.

When your Design System is as much a feat of engineering as it is a collection of UI elements, you can’t leave all that effort and business value behind in different tooling.

You can't copy it across as an SVG either.

Magicul is the only converter capable of moving Components between XD and Figma, and by process of elimination, Magicul is also the only converter that can understand Component hierarchy- Components inside of Components - and knows how to move these relationships between tools.

demonstrating child components in Figma

5 steps to convert your files from XD to Figma 🐾

Step 1: Save the XD as a local document

saving as a local document

Step 2: Go to the Magicul homepage and select the XD to Figma conversion option.

upload your file

Step 3: Upload your XD file and select convert now

preview file magicul adobe xd to figma conversion

Step 4: Pay for your Magicul conversion.

For more information about pricing click here.

Step 5: Download the converted file and open it in Figma

open conversion in Figma after adobe XD conversion

Two features of Adobe XD we can't convert to Figma

1: Auto Aware Layouts to Auto Layouts

Figma’s auto layouts are different from XD’s auto aware layout, and we don't support a conversion between them (yet).

Groups and Components help quickly set up Auto Layouts

Magicul supports Frames, Component, and Group Layouts. Preemptively grouping elements in XD can save time by letting you or your team apply auto layouts to Figma groups, frames, Components, and their instances, after the conversion.

If you think auto layouts to auto aware layout is an important feature, put some pressure on us to release it faster:

feedback.magicul.io

2: Transitions and Prototyping

Magicul uses Figma’s API to build exact copies of your XD files in Figma. There are limitations to what Figma will let people do with its API. Because of these limitations, we don't support Protoyping and Transitions from XD to Figma as of right now.

Figma's Prototyping is read-only

We are developing a work-around. If Prototyping and Transition connections are all that are keeping you in XD, please let us know, and we'll hurry Prototyping support along.

feedback.magicul.io

The next step - 1 Free Artboard Trial 👍

What next?

You need to try it out for yourself.

Magicul offers a free trial so you can convert your own file and stress test the conversion.

Contact us in the support if you’re interested in converting a single artboard file.

Guides like this will only get you so far. Feel the quality with your own hands. Convert your own file now!

现在开始

注册我们的时事通讯

注册以了解有关新产品功能、特别优惠等的更多信息。

This website uses cookies to improve the experience. Essential cookies will be stored in order to run the website. You can accept or decline to store optional cookies. Privacy Policy