---
title: "How to Combine Multiple Elements in Figma and Export as an Image?"
url: https://uichemy.com/docs/combine-multiple-elements-in-figma-and-export-as-an-image/
date: 2023-07-26
modified: 2026-04-14
author: "Sagar Patel"
description: "Locking 1. Want to Simplify Your Figma Layout for Export? If you are using multiple elements to create a single object in your Figma layout, you can combine those elements..."
image: https://uichemy.com/wp-content/uploads/2024/01/How-to-Combine-Multiple-Elements-in-Figma-and-Export-as-an-Image_-min-1024x536.jpg
word_count: 232
---

# How to Combine Multiple Elements in Figma and Export as an Image?

## Key Takeaways

- UiChemy allows users to combine multiple elements in Figma and export them as a single image, reducing file size.
- Locking a frame in Figma enables UiChemy to treat the frame and its elements as a single element during export.
- Using the locking feature helps prevent issues with SVG icons being divided into separate sections when imported into Elementor.

## Locking

**1. Want to Simplify Your Figma Layout for Export?** If you are using multiple elements to create a single object in your Figma layout, you can combine those elements and export them as a single image using UiChemy.

By default, when you export your Figma layout using UiChemy, every design element will be exported as an individual element in the template. But if you want a group of design elements to be exported as a single image, you can do that with UiChemy.

By doing this, you will reduce the exported file size because it will export fewer elements, making it easier to maintain.

## Using Locking

**For example**, we have this design where multiple elements are used to create the section. Now, to export the entire section as an image, just lock the frame.

![figma lock frame](https://uichemy.com/wp-content/uploads/2023/07/figma-lock-frame.gif)

Now, if you export the layout, UiChemy will treat that frame and its elements as a single element, and in Elementor, it will show as a single image.

![elementor exported combine elements as image](https://uichemy.com/wp-content/uploads/2023/07/elementor-exported-combine-elements-as-image.gif)

Another common use case of this locking feature can be in SVG images or icons. In Figma, SVG icons are divided into separate sections, which can cause problems when you import the template into Elementor.

For example, we have this SVG icon, as you can see, all its elements are separated into different sections, now if we lock the main section, it will be exported as a single image.

![figma lock frame svg](https://uichemy.com/wp-content/uploads/2023/07/figma-lock-frame-svg.gif)

![elementor exported combine elements as image svg](https://uichemy.com/wp-content/uploads/2023/07/elementor-exported-combine-elements-as-image-svg.gif)

## Frequently Asked Questions

**Q: What should I do if my elements aren't combining in Figma?**
A: If your elements aren't combining as expected, ensure that you have locked the frame containing those elements before exporting. Locking the frame allows UiChemy to treat it as a single element, which simplifies the export process and reduces file size. This is especially useful for complex designs where multiple elements are used to create a single object.

**Q: What is the best practice for exporting multiple elements in Figma?**
A: The best practice for exporting multiple elements in Figma is to lock the frame that contains those elements. This allows UiChemy to export them as a single image, reducing the number of exported elements and file size. This method is particularly effective for maintaining design integrity and optimizing performance in WordPress.

**Q: How does locking help with exporting designs in UiChemy?**
A: Locking helps by allowing UiChemy to treat a group of elements as a single entity during export. This means that instead of exporting each element individually, which can clutter your template, you get a cleaner output with fewer elements. This is particularly beneficial for complex sections or SVG graphics.

**Q: What happens if I forget to lock my elements before exporting?**
A: If you forget to lock your elements before exporting, UiChemy will export each element individually. This can lead to a larger file size and a more complex template, making it harder to manage in WordPress. Locking is crucial for simplifying your export and ensuring that your design appears as intended.

**Q: Does UiChemy support exporting designs created with other tools besides Figma?**
A: No, UiChemy only supports exporting designs created in Figma. It does not convert designs from any other design tool. This limitation means you need to ensure your designs are finalized in Figma before using the UiChemy Figma Plugin for export.
