> For the complete documentation index, see [llms.txt](https://docs.uichemy.com/llms.txt).
> Use it to discover all available pages before exploring further.

# How to Export Non-Auto Layout or Auto Layout design from Figma to Elementor using UiChemy?

Export both Auto Layout and non-Auto Layout Figma designs to Elementor with UiChemy.


With UiChemy, you can export both Auto Layout and non-Auto Layout designs from Figma to Elementor.

For the best results, use Auto Layout, but that doesn't mean you have to build your entire design with Auto Layout from the start. UiChemy's Auto Layout conversion feature lets you turn any regular (non-Auto Layout) design into Auto Layout with a single click, making your Elementor conversion more accurate.

<Callout kind="tip">
While this feature converts non-Auto Layout designs to Auto Layout, it's still recommended to follow the design guidelines for the best result.
</Callout>

If you'd rather not convert your design to Auto Layout at all, you can export the non-Auto Layout design to Elementor directly instead.

### Convert Non-Auto Layout Design to Auto Layout Using UiChemy

In the UiChemy plugin, select your frame and choose **Classic Mode → Step by Step Method**. After Optimize Multi-Layer Media (Step 2) and Widget Tagging Mode (Step 3), you'll reach **Step 4: Optimize Your Design**. In the **Manage Auto Layout** panel, choose **Convert to Auto Layout**. This duplicates your design and converts it into Auto Layout, without affecting the original.

<Callout kind="info">
The conversion result depends on your design's structure and standard grouping.
</Callout>

Use the duplicate design for tagging in the next step.

<Callout kind="info">
Non-Auto Layout to Auto Layout conversion is only available for Figma to Elementor conversion.
</Callout>

See [First Conversion](/classic-mode/getting-started/first-conversion) for the full 8-step walkthrough.

### Export Non-Auto Layout Design Directly to Elementor

If you'd rather convert your non-Auto Layout design to Elementor without converting it to Auto Layout, choose **It's already in Auto Layout** instead at Step 4, and continue through the rest of the wizard as normal.

<Callout kind="tip">
Whether your design is in Auto Layout or not, it's strongly recommended to lock its media in Step 2 before exporting, for the most accurate conversion.
</Callout>

Once conversion finishes, export the design using **Copy to Clipboard** or **Direct Import**.

<Callout kind="info">
The plugin automatically recommends an export method based on how you selected the design, you may see Copy to Clipboard, Direct Import, or both.
</Callout>

Open the page or template in the Elementor editor where you want to add the design, right-click, select **Paste from other site**, and press **Ctrl + V**. Your non-Auto Layout design is added to Elementor.

### Frequently Asked Questions

<ExpandableGroup>
  <Expandable title="What should I do if my design doesn't convert properly to Auto Layout?" default-open="false">
    Check the structure and grouping of your layers, conversion accuracy depends heavily on how well your design is organized. Using Manual Optimization before conversion can help; if issues persist, adjust your design according to the [design guidelines](/design-optimization/auto-layout/best-practices).
  </Expandable>

  <Expandable title="What is the best practice for exporting designs from Figma to Elementor?" default-open="false">
    Use Auto Layout where possible, UiChemy can convert non-Auto Layout designs to Auto Layout with one click, which improves conversion accuracy. Always lock your media in Step 2 before exporting.
  </Expandable>

  <Expandable title="What happens if I skip Manual Optimization during export?" default-open="false">
    You may get a less accurate conversion, since Manual Optimization walks you through fixing specific structural issues (like unlocked media or unflattened vector groups) that Auto mode may not fully resolve on its own.
  </Expandable>
</ExpandableGroup>