JavaScript Components

Let's walk through what you need to do to move to Version 6 using Font Awesome's JavaScript Components.

Version 6 JavaScript Components are Backward Compatible!

We've taken care of backward compatibility with Version 5 JavaScript components. So once you get the new files, you're off and fa-running.

Update Files

In order to use Font Awesome Version 6 you'll need to upgrade the Font Awesome files used by the component of your choice.

Using npm-check-updates

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

npx npm-check-updates --filter "/@fortawesome.*/" --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.

// This updates all packages with pending updates
npm update

// This is more surgical.
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 upgrade command for updating your packages.

// This updates all packages with pending updates
yarn upgrade

// This is more surgical.
yarn upgrade @fortawesome/fontawesome-pro

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

You're All Set!

Your project will now load Version 6 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.

You might want to go check out the big pile of new icons we've added in Version 6 (including the new Thin style!) or check out all of Version 6's new styling options.