Icons

AI Tools

Add Font Awesome icons to your pages. Font Awesome 7 Free is loaded, giving you the Solid, Regular, and Brands styles.

How to add an Icon?

To add an icon, start typing "/" and choose Icon from the inline blocks list.

To put an icon next to an entry in your navigation index instead, see Index Icons.

Icon Examples

  • Database

  • User

Styling Icons

⭐
Available in Pro Projects

To style icons, you can provide CSS in Custom CSS, and supply the class used in Classes option when editing the icon. For example:

  • Icon with primary colour (already available) by applying primary-text class.

  • Icon with primary background (already available) by applying primary-background class.

  • Icon with a different background colour using the following CSS:

.custom-icon.blue-bg {
background: blue;
color: white;
padding: 2px;
}


inline-blocks
  Last updated by Zaid Daba'een