All Collections
Element Tutorials
Content
Use the Icon Element to add icons to your page content
Use the Icon Element to add icons to your page content

The icon element taps into Font Awesome's open source library of almost 1,000 icons

Updated over a week ago

Icons can be a great alternative to using text, they can convey the same message to a user as a button, but take less effort to understand.

How to use the Icon element

  1. You can select the Icon Element by dragging it from the sidebar onto the page.

  2. On the sidebar, you can start typing in the name of the icon you are looking for, and the dropdown menu will be auto populated with options.

4. Configure the size and color of the icon in the righthand sidebar.

5. Use the alignment feature to position the icon on the page or within its containing element.

You can browse Font Awesome's Icon library and check out all the great icons you can now use in Shogun here:

New to the Element

Aria Labels

The icon element now features the option to add an aria-label for accessibility purposes

Frequently Asked Questions

I don't see an icon I want, how do I add it?

At present it's not possible to add user-uploaded icons or obtain icons not found in the foundry version seen above, however, you can always upload icons you find on the internet or used elsewhere to the image element to place alongside the ones we do have.

Did this answer your question?