The Icon widget is useful for displaying FontAwesome icons in numerous styles on your page.
There are 3 different views for the widget: Default, Stacked, and Framed.
If Default view is chosen, the following options are available:
Content
1. Icon: Choose from a list of Font Awesome icons
2. View: Choose between default, stacked or framed
3. Link: Enter the URL for the item’s link. Click the Link Options cog 
to either add rel=nofollow to the link or to open the link in a new window.
to either add rel=nofollow to the link or to open the link in a new window.4. Alignment: Align the icon to left, center or right.
Style
Icon
Normal
1. Primary: Choose the main and secondary colors for the icon
2. Size: Increase or decrease the size of the icon
3. Rotate: Rotate the icon
Hover
1. Primary Color: Set colors for the hover
2. Hover Animation: Set any animation for the hover state
3. Size: Set the exact size of the icon
4. Rotate: Rotate the icon up to 360 degrees
If Stacked or Framed view is chosen, the following options are available:
Content
1. Icon: Choose from a list of Font Awesome icons
2. View: Choose between default, stacked or framed
3. Shape: Choose the shape of the stack or frame, either Circle or Square
4. Link: Enter the URL for the item’s link. Click the Link Options cog 
to either add rel=nofollow to the link or to open the link in a new window.
to either add rel=nofollow to the link or to open the link in a new window.5. Alignment: Align the icon to left, center or right.
Style
Icon
Normal
1. Primary Color: Choose the primary color (the background or frame) color for the icon
2. Secondary Color: Choose the secondary color, which is the color of the icon itself
3. Padding: Set the padding around the icon to control the size of the stack or frame
4. Size: Set the size of the icon.
5. Rotate: Rotate the icon up to 360 degrees
6. Border Radius: Set the border radius to control the corner roundness of the stack or frame
Hover
1. Primary Color: Choose the primary color (the background or frame) color for the icon
2. Secondary Color: Choose the secondary color, which is the color of the icon itself
3. Hover Animation: Choose an animation effect when hovering over the icon, such as Grow, Pulse, Skew, etc.
4. Padding: Set the padding around the icon to control the size of the stack or frame
5. Size: Set the size of the icon.
6. Rotate: Rotate the icon up to 360 degrees
7. Border Radius: Set the border radius to control the corner roundness of the stack or frame