Submit Feedback
Legacy Knowledge Base
Published Jul. 2, 2025

How to apply Font Awesome in a custom theme

Written By

József Géczi

How To articles are not official guidelines or officially supporteddocumentation. They are community-contributed content and may not alwaysreflect the latest updates to Liferay DXP. We welcome your feedback toimprove How to articles!

While we make every effort to ensure this Knowledge Base is accurate, itmay not always reflect the most recent updates or official guidelines.We appreciate your understanding and encourage you to reach out with anyfeedback or concerns.

Legacy Article

You are viewing an article from our legacy "FastTrack"publication program, made available for informational purposes. Articlesin this program were published without a requirement for independentediting or verification and are provided "as is" withoutguarantee.

Before using any information from this article, independently verify itssuitability for your situation and project.

Issue

  • As a developer, I would like to apply Font Awesome in my custom theme via Maven.

Environment

  • Liferay DXP 7.1

Resolution

1) Create a theme based on the Simple Theme Maven Blade Sample:

blade create -t theme -v 7.1 -b maven -p com.liferay.docs.theme -c Theme theme

2) Add the font_awesome.scss based on the Importing Clay CSS into a Theme - Customizing Clay Base section to theme/src/main/webapp/css/font_awesome.scss.
Check if the theme builds successfully (run command 'mvn verify').

3) Deploy the theme to Liferay DXP 7.1. 
In a Basic Web Content, add the following code as an example:

<i class="icon-caret-down"></i> icon-caret-down

Into portal_normal.ftl, add the following code - also as an example:

<@liferay_ui["icon"] icon="angle-down" />

See attached screenshot for results and source of the proof-of-concept theme.

Please note: When applying Font Awesome v3.2.1 included Clay with CSS rules, use font-family: FontAwesome.

Additional Information

Did this article resolve your issue ?
Legacy Knowledge Base
Did this article resolve your issue ?