How to Tag The Icon Box Widget for Figma to Elementor?

Key Takeaways

  • UiChemy allows tagging of elements in Figma designs to the Elementor IconBox widget.
  • The Step by Step Method enables users to select and tag a frame containing an icon, title, and description as an Icon Box widget.
  • Exporting the design after tagging results in the Icon Box widget using all specified information.

Table of Contents

Are you showing any key features, benefits, or services on your Figma design? Then you can tag those elements to the Elementor IconBox widget using the UiChemy plugin.

Using the IconBox widget, you can take advantage of its features directly when you export the template.

What Can be Tagged?

A frame containing an icon, title, and description can be tagged as an Icon Box widget.

How to Tag?

To do this, you can choose between two options: Step by Step Method or Express Conversion.

Here, we’ll go with the Step by Step Method.

  1. First, select the Step by Step Method and click on the Start button.
  2. Select the top-level page or frame of your layout, then click on the Next button.
  3. Under the Widget Tagging Mode tab, select the Manual Widget Tagging Option.
  4. Next, under the Manage Auto Layout tab, you’ll see two options: It’s already in Auto Layout and Convert to Auto Layout. We’ll go with the first option.
  5. After that, under the Tag Widgets tab, choose the frame or container that contains your element (Widget). Then, search for the Icon Box widget in the UiChemy panel and select it. Here, you’ll see all the supported Elementor widgets.

Then you’ll see widget specific tagging options, and most of the options will be auto-filled based on your design.

  1. The Icon field will be automatically filled, but you can click the dropdown to change the icon. It will automatically list all the available options within your selected element. You can also select any frame or element to be used as an icon by clicking on the eyedropper tool, and the option will be available in the dropdown as well.
  2. The Title field will be automatically filled, but you can click the dropdown to change it.
  3. In the Description field, it will be automatically filled, but you can click the dropdown to change it.
  4. From the Title Html Tag field, you can assign an HTML tag to the Icon Box title.
  5. Once done, click the Save button to complete the tagging, and you’ll see a Tagged successfully message.

Now if you export the design, that element will use the Icon Box widget with all your specified information.

exported template with iconbox

Resource

About the Author

Photo of Sagar Patel CEO of UiChemy
CEO · UiChemy · 11 years experience

Sagar is the Founder & CEO of POSIMYTH Innovations, with 10+ years building WordPress products trusted by 100,000+ websites globally. He has led the development of The Plus Addons for Elementor, Nexter, WDesignKit, and UiChemy, all built hands-on from concept to launch. His work focuses on making website building faster, more flexible, and accessible for creators and businesses worldwide.

WordPressFigmaUI DesignWeb DesignElementorBricksAutomationClaudeAI

Related Frequently Asked Questions


What should I do if the Icon Box widget doesn't appear after tagging?

If the Icon Box widget doesn't show up after tagging, ensure that you selected the correct frame or container that contains your element. Double-check that you followed the tagging steps accurately, especially under the Tag Widgets tab. If issues persist, try re-exporting the design to see if the changes take effect.

What is the best method for tagging the Icon Box widget?

The Step by Step Method is the recommended approach for tagging the Icon Box widget. This method allows you to manually select and tag elements, ensuring that all fields like the icon, title, and description are accurately filled based on your design. This level of detail helps maintain the integrity of your design during the export process.

Are there any limitations when tagging the Icon Box widget?

One limitation is that the UiChemy Figma Plugin only supports tagging elements for the Icon Box widget if they are structured correctly in Figma. If your design does not include a frame with an icon, title, and description, you won't be able to tag it as an Icon Box widget. Ensure your design meets these criteria before tagging.

Last reviewed: April 14, 2026