Upgrade on the Desktop
We’ve worked hard to make upgrading to Version 7 on the desktop as smooth and easy as possible.
We’ll cover the basics of how to upgrade to Font Awesome 7 and how to troubleshoot common challenges.
Add the V7 Font Files
Section titled “Add the V7 Font Files”Upgrading on the desktop is the same as adding a new font, so you can follow the usual set-up steps.
- Close any desktop programs that may be using older versions of the Font Awesome fonts.
- Add the Font Awesome 7 OTF font files to your system font manager.
- Activate the fonts.
Viola! Now you will see “Font Awesome 7” as one of the options in your font selection menus.
If you’re having trouble getting the new fonts to load, they might be cached in your application. Here are a couple of articles that might help:
- Troubleshoot font issues in Adobe applications on Mac OS X (from Adobe)
- How to Clear Your Application Font Cache (from MyFonts)
Update Existing Design Files to Use Font Awesome 7
Section titled “Update Existing Design Files to Use Font Awesome 7”Adding V7 font files doesn’t affect any of the existing older Font Awesome icons already in your designs. To update the icons in your designs, select any text area set to use the older Font Awesome font faces then select the Font Awesome 7 family font face you would like those icons to use. You can change the style from the font-weight menu: you’ll see Solid, Regular, Light, and Thin options.
Some programs allow you to multi-select text areas to swap them all out between different font faces easily if you want to upgrade a particular file or design to go from Font Awesome 5 or 6 to Font Awesome 7.
For Figma, if you select a text item using a Font Awesome 5 or 6 font face, you can use the “Select All with the Same Font” action under the Edit menu.
For Illustrator, you can use the “Find Font” action under the Type menu.
Upgrading Icons as SVGs
Section titled “Upgrading Icons as SVGs”In order to upgrade your SVGs to Version 7, you need to swap out the older version placed SVG with the new one from Version 7:
- Grab the SVG you want to swap from the Version 7 desktop download files.
- Drop the desired SVG into your vector friendly program and adjust it to match the size and placement of your previous icon.
Upgrading Duotone Icons
Section titled “Upgrading Duotone Icons”Duotone icons need a bit of special handling when upgrading, whether you placed the icon using ligatures, glyphs, or as SVGs.
Duotone Ligatures
Section titled “Duotone Ligatures”If you have existing files that reference Version 6 Duotone icons using the ligature shortcuts, those will need to be manually updated to the new v7 syntax. Here are the manual steps to take for each reference:
- Select the text boxes that contain the V6 Duotone icon’s layers
- Set the Font/Typeface to Font Awesome 7
You can find more information about how to use Duotone ligatures in our Ligatures desktop doc.
Updating Version 5 Duotone Icons as Ligatures
Section titled “Updating Version 5 Duotone Icons as Ligatures”In Version 6, we made some changes in how you add Duotone icons into your designs using ligatures, so if you’re upgrading directly from Version 5 to Version 7, you’ll need to update those in your designs manually.
In Version 5 you would access the primary layer using the -primary suffix and the secondary layer using the -secondary suffix. In Version 6 and later, you now access the primary layer using a single hash (#) suffix and the secondary layer using a double has (##) suffix.
| Layer | v5 Shortcut | v5 Example | v6 and v7 Shortcut | v6 and v7 Example |
|---|---|---|---|---|
| Primary layer | [icon-name]-primary | crow-primary | [icon-name]# | crow# |
| Secondary layer | [icon-name]-secondary | crow-secondary | [icon-name]## | crow## |
Duotone Glyphs
Section titled “Duotone Glyphs”To upgrade your Duotone glyphs, you’ll treat it like changing any other type of font, but remember that Duotone icons have multiple layers. Here’s what you need to do:
- Select each existing glyph layer.
- Switch the selected font to Font Awesome Version 7.
Your glyph layers will update and now you’re rocking the latest and greatest Font Awesome! For more information on aligning or using your glyphs please refer to our guide for using Duotone glyphs.
Duotone SVGs
Section titled “Duotone SVGs”In order to upgrade your Duotone SVGs to Version 7, you need to swap out the older version placed SVG with the new one from Version 7:
- Grab the SVG you want to swap from the Version 7 desktop download files.
- Drop the desired SVG into your vector friendly program and adjust it to match the size and placement of your previous icon.
- Update your layers to give them the desired look.
You can find more information about how to use Duotone SVGs in our guide for using SVGs on the Desktop.
Adding and Using V7 Pro+ Font Files
Section titled “Adding and Using V7 Pro+ Font Files”With Version 7, we’ve introduced a whole bunch of new Icon Packs. The process for adding these collections is the same as adding other V7 font faces or adding icons as SVGs.
But remember, Pro+ Icon Collections have a more limited set of icons - a Pro+ Pack’s style may not have the icon you used in another Font Awesome icon style. If you’re not sure, you can search our icons and limit to the Pro+ style you would like to use to see if the icon is included.
You’re all set!
Section titled “You’re all set!”Your Desktop projects and applications will now render Version 7 icons! Are you running into trouble? Check out our troubleshooting guide for answers to common questions about using Font Awesome on the Web.
Next steps: Go explore all the icons available in Version 7 and start designing something awesome!