--- title: "How to Export Non-Auto Layout or Auto Layout design from Figma to Elementor using UiChemy?" url: https://uichemy.com/docs/export-non-auto-layout-or-auto-layout-design-from-figma-to-elementor-using-uichemy/ date: 2025-04-28 modified: 2026-04-14 author: "Sagar Patel" description: "With UiChemy, you can easily export both auto layout and non-auto layout designs from Figma to Elementor. To get the best results when converting your Figma design to Elementor, we..." word_count: 730 --- # How to Export Non-Auto Layout or Auto Layout design from Figma to Elementor using UiChemy? ## Key Takeaways - UiChemy allows users to export both auto layout and non-auto layout designs from Figma to Elementor. - UiChemyu2019s Auto Layout conversion feature enables users to convert non-auto layout designs into auto layout with one click. - Users can export non-auto layout designs directly to Elementor without converting them to auto layout using UiChemy. - The conversion result from Figma to Elementor depends on the designu2019s structure and standard grouping. With UiChemy, you can easily export both auto layout and non-auto layout designs from Figma to Elementor. To get the best results when converting your Figma design to Elementor, we recommend you to use **Auto Layout**. But don’t worry—this doesn’t mean you have to create your entire design using Auto Layout from the start. With UiChemy’s Auto Layout conversion feature, you can quickly turn any regular (non-Auto Layout) design into Auto Layout with just one click. It’s fast, easy, and helps make your Elementor conversion much more accurate.  > *Note: While this feature does convert non auto layout design to auto layout it is always recommended to *[*follow the design guideline*](https://uichemy.com/optimize-your-designs-for-excellent-export-result/)* for the best result.*  But if you don’t want to convert your design to auto layout, you can export the non-auto layout to Elementor as well. ## Convert Non-Auto layout Design to Auto Layout using UiChemy Plugin To use the auto layout conversion feature, follow the steps -  - In Figma, go to **Resources** > **Plugins** and search for **UiChemy** and click on it. It will open the UiChemy plugin interface and log in to your account. - Then select the frame you want to export. - Then select the **Optimize **option and click the **Optimize **button. - On the next screen, go to the **Optimization Companion** tab.  - Then, lock the necessary layers from the **Lock Multi Layer Media** section. - After that, in the **Convert Non-Auto Layout design to Auto Layout** section, set the toggle to **Manual**. > *Note: If you keep the toggle to Auto it will not optimize your design for auto layout. It is ideal if your design is already in auto layout.* - Then click on the **Duplicate & Optimize Design** button. Now it will duplicate your design and convert it into an auto layout without affecting your original design. > *Note: Conversion result will depend on the design’s structure and standard grouping.* After that, make sure to use the duplicate design for tagging. Just in case you didn’t convert the design to auto layout from here, you’ll find an option in the **Widget Tags** tab. Click on the **No** button in the, **Is your design optimized?** section. Then click on the **Optimize** button, and it will duplicate your design and convert it into an auto layout. Now, if you convert your design to Elementor, it will give a more accurate conversion. > *Note: Non-Auto Layout to Auto layout conversion is only available with Figma to Elementor conversion.*  ## Export Non-Auto Layout Design Directly to Elementor Now, if you simply want to convert your non-auto layout design to Elementor without converting to auto layout, you can do that too with UiChemy. To do so, follow the steps -  - In Figma, go to **Resources** > **Plugins** and search for **UiChemy** and click on it. It will open the UiChemy plugin interface and log in to your account. - Then select the frame you want to export. - Then select either the **Optimize **or **Express **option and click the **Optimize **or **Convert** button as per your selection. Let’s select **Express**. Whether your design is in Auto Layout or not, we strongly recommend locking it using the Optimization Companion before starting the export process. This ensures the design is properly optimized. If your design is already optimized, locked, and widget-tagged, you can directly use the Express method for a faster export process. > *Note: *[*Use the Optimize option*](https://uichemy.com/docs/export-figma-design-to-elementor-using-uichemy/)* if you want to use more advanced options like Optimization companion to optimize design, Widget Tags to tag widgets, Responsive manager feature to manage the responsiveness of your design, Global Styles for syncing colors and fonts,* etc. We recommend that you *optimize your design before exporting for a more accurate result.* - After that, you can export the design using the **Copy to Clipboard** or [**Live Import** method](https://uichemy.com/docs/what-is-direct-import/). Let’s select the **Copy to Clipboard **option. > *Note: The plugin will automatically recommend an export method based on how you select the design. As a result, you may see either Copy Mode, Live Import, or both options.* - Then, it will copy the entire design after that, click on the **Copy to Clipboard** button. - After that, open the page or template where you want to add the design in Elementor editor and right-click on the page, then select the **Paste from other site** option and press **Ctrl + V,** and the design will be pasted on your page. Now your non-auto layout design will be added to Elementor. ## Frequently Asked Questions **Q: What should I do if my design doesn't convert properly to Auto Layout?** A: If your design doesn't convert properly to Auto Layout, check the structure and grouping of your layers. UiChemyu2019s conversion accuracy depends on how well your design is organized. Using the Optimize option before conversion can help ensure better results. If issues persist, consider adjusting your design according to the [design guideline](https://uichemy.com/optimize-your-designs-for-excellent-export-result/). **Q: What is the best practice for exporting designs from Figma to Elementor?** A: The best practice is to use Auto Layout for your designs when exporting to Elementor. UiChemy allows you to convert non-Auto Layout designs to Auto Layout with one click, which enhances the accuracy of the conversion. Always lock your layers using the Optimization Companion before exporting to ensure optimal results. **Q: What happens if I skip the Optimize option during export?** A: Skipping the Optimize option may lead to less accurate conversions and could affect the responsiveness of your design in Elementor. The Optimize option provides advanced features like widget tagging and global styles, which are crucial for maintaining design integrity. It's advisable to optimize your design before exporting for the best results.