Using Font Awesome icons

Matrix themes include some external plugins and libraries to enhance your website with more professional features. Among these is the Font Awesome framework, which enables you to add custom icons to your website. Font Awesome icons can be found in custom widgets and certain admin elements, such as slider arrows, copy buttons, etc.

Full list of available Font Awesome Icons in Matrix Themes can be found here:

https://fontawesome.com/icons 

In Matrix Themes, go to the admin menu, select 'Shortcodes,' and then choose 'Fa Description' to find examples of text boxes with Font Awesome Icons

 Check the following example of a widget using an icon from Font Awesome framework:

 <div class="fa fa-gem fa-4x">
 </div>

Icon size

To make the icons bigger, you can use the classes

fa-lx, fa-2x, fa-3x, fa-4x, fa-5x

The other method is using the inline style:

 <div class="fa fa-gem" style="font-size:30px;>
 </div>

Color setup

The same way with inline style you can change the color of the icon

 <div class="fa fa-gem" style="color:#ad1313;">
 </div>

To update the Font Awesome framework to the latest version used in Matrix themes, please follow the steps below:

1. Go to the 'Updates' section and download the file 'libraries.css.' Upload it to your website in Design > Custom Templates > Files.
2. In the same 'Updates' section, you will find the font icons in a zip folder. Download it and upload all 8 files to your website (Design > Custom Templates > Files).