Font Awesome 6

This module integrates Font Awesome 6 into your entire Odoo ecosystem: website, email templates, reports, backend, and even custom modules. It provides a consistent way to use the latest vector icons everywhere in Odoo, with full control over families and styles (classic, duotone, brands, etc.).

Installation

Buy a Pro plan

• Go to fontawesome.com/plans
• Select a plan that allows you to download the icons

Choose the Pro(+) or Pro Max(+) plan

Create your Kit

• If you want to use the full Pro icon set, you can go directly to fontawesome.com/download
• Download the Pro For Web
• Skip this section and go directly to the third step in the Download your Kit (Web) section.
• Be aware that downloading the full Pro version may slightly slow down your Odoo instance due to the number of icons included.

• Go to fontawesome.com/start
• Select the styles you want, choose the host, and finally create your Kit

• Only select the styles you really need to avoid overloading Odoo and making it slower
• You can edit the selected styles later in your Kit's settings

Choose the styles you need

Select the Package Manager host

Customize your Kit

Download your Kit (Web)

• Go to the Download section of your Kit
• Click the Download Web Files button
• Unzip the folder and place it inside the font_awesome_6 module
• Rename the folder to setup-fontawesome

The download may take a while depending on the number of styles you have selected, or it may even stop due to a timeout
If this happens, follow the next step Download your kit (npm)

Download Web Files

Unzip it, move it, and rename it

Download your Kit (npm)

You need to have Node.js installed on your machine in order to be able to use npm or yarn.

• Go to the Package section of your Kit
• Follow the first two steps:
  • Create a .npmrc file
  • Install your package
• Run the commands inside the font_awesome_6 module

Follow the first two steps

What you should have afterwards

Run the Final Script

• Open your terminal inside the font_awesome_6 module
• Execute the setup.sh file inside this folder

Using the web download

Using the npm download

Best Practices

• If you're using custom icons, use a prefix to avoid conflicts with existing icons.
  fa-prefix-name-custom-icon
• If you update your kit (e.g., add new styles or icons), you need to repeat the steps above.
• If you want to go back to the free version, you can create a free kit or download the Free For Web kit from fontawesome.com/download and redo the setup steps.

Usage

Website Editor

• You can select any icon you want by opening the icon selector in the website editor
• The list shows up to 50 icons for each family/style combination
• The search bar filters icons based on their keywords, not just their names
• You can also filter by family and style

• During editing, duotone icons might not display correctly. This is normal - they will be shown properly once the page is saved.
• The brands style is only available in the classic family
• The icons will also be available inside the HTML Fields or Templates

Website Icon Selector

Html Field Icon Selector (Contact Internal Notes)

Email Template Icon Selector (Email Marketing Mail Body)

Code Integration

• You can insert icons wherever you need by directly editing the code.
• Reports, views, Owl templates, and more.

If you want to add the icons to an asset bundle, simply include font_awesome_6.styles in your bundle.

Invoice Report

Invoice Report (code)

Contact View

Contact View (code)

Pos Action Button

Pos Action Button (code)