Articles on: Components & Elements

Icon

Getting Started


You can add icons to your website using the icon element for various purposes. This article will cover how you can add the element to your website and customize it according to your preferences. Follow the instructions accordingly.




Adding the Icon element


By following the simple steps below, you can easily add the Icon element ****to your site.


  • Click on + Add Element or Containers in an empty Container
  • From the Elements option, select the Icon element


Refer to the GIF below:



Icon Element


Icon element after it is added



Editing the Icon element


Follow the steps and instructions below to add and edit an Icon element on your site.


The Icon element editor has the following options:


  • Icon
  • Icon Background
  • Link Icon
  • Inline Icon


The Icon element editor:





Icon


This option lets you pick the icon from various packs, from editing the icon color to setting the icon size, alignment, etc.


Refer to the GIF below to see the demonstration:





Icon Background


This option lets you add a background color or gradient to your icon. Also on hover effect.


Refer to the GIF below to see the demonstration:






This option lets you add a link to your icon, so it redirects a user to an external link, page, section, etc.


Refer to the GIF below to see the demonstration:






Inline Icon


This option lets you select whether you want your Icon to be in line with other Icon or not.


💡 This feature is only available for users of our previous version or for those using the Row/Column options.



Refer to the GIF below to see the demonstration:





Related articles


Navigation


Background Styles

Updated on: 05/06/2024

Was this article helpful?

Share your feedback

Cancel

Thank you!