Upgrade Package Managers

Are you using a package manager like npm or yarn to handle your Font Awesome assets? Here are some handy tips for upgrading your project to Font Awesome Version 7.

Pro+ Icons are only available in Kit Packages!

Along with a Pro+ Plan, you'll need to install a downloaded Kit package to use any of our Pro+ Icons — they are not available in any other packages.

Using npm-check-updates

For a nice upgrade experience we recommend using npm-check-updates.

npx npm-check-updates --filter "/@fortawesome.*/" --target greatest --upgrade

// or this for Kit packages
npx npm-check-updates --filter "/@awesome.me.*/" --target greatest --upgrade

Using npm

If you prefer to use plain vanilla npm, you can run the built in npm update command from the directory where your package.json file lives.

// Use this to update all packages with pending updates (which will include Font Awesome)
npm update

// Or you can just update your Font Awesome packages
// Update a Kit package - be sure to replace [KitID] with your Kit's ID
npm update '@awesome.me/kit-[KitID]'

// Update SVG core + specific styles - edit or add the styles you use in your project
npm update @fortawesome/fontawesome-svg-core
npm update @fortawesome/pro-solid-svg-icons
npm update @fortawesome/sharp-light-svg-icons
npm update @fortawesome/sharp-duotone-solid-svg-icons
...

// Update the Free package
npm update @fortawesome/fontawesome-free

// Update the Pro package
npm update @fortawesome/fontawesome-pro

For more information on updating a package using npm check out the official docs.

Using Yarn

Yarn has the yarn up command for updating your packages.

// Use this to update all packages with pending updates (which will include Font Awesome)
yarn up

// Or you can just update your Font Awesome packages
// Update a Kit package - be sure to replace [KitID] with your Kit's ID
yarn up '@awesome.me/kit-[KitID]'

// Update SVG core + specific styles - edit or add the styles you use in your project
yarn up @fortawesome/fontawesome-svg-core
yarn up @fortawesome/pro-solid-svg-icons
yarn up @fortawesome/sharp-light-svg-icons
yarn up @fortawesome/sharp-duotone-solid-svg-icons
...

// Update the Free package
yarn up @fortawesome/fontawesome-free

// Update the Pro package
yarn up @fortawesome/fontawesome-pro

Check out the official Yarn documentation for more information about upgrading your files.

More Info on Using Packages

If you’re having trouble with your packages, or need more details, check out our main Use a Package Manager docs which has all the info you need when getting Font Awesome set up with packages.

---

You're all set!

Your project will now load Version 7 and render any existing icons using our newest and freshest icons and options. Are you running into trouble? Check out our troubleshooting guide for answers to common questions about using Font Awesome on the Web.