# Upgrade to v7 with React

Instructions for upgrading Font Awesome in React applications to v7.

Wondering how to upgrade your Font Awesome React component from v6 to v7 and use all the new fancy family styles?
We got you covered.

Make sure you have the following in place:

- A project using [React](https://react.dev/) 16.3 or later
- [Access configured](/web/setup/packages.md#1-configure-pro-package-access) to use Font Awesome packages (for Pro/Pro+ Icons)
- An active [Pro+ Plan](https://fontawesome.com/plans?plans=plus) and a [v7 Kit](/web/setup/use-kit.md) with [Package Installation enabled](/web/setup/use-kit.md#enable-package-installation-for-your-kit) to use [Pro+ icons](https://fontawesome.com/search?ic=pro-plus-collection)

## 1. Remove Older Versions

Remove any entries of `react-fontawesome` and `fontawesome-svg-core` packages from your `package.json` or `yarn.lock` file:

```json
  // these need to be removed
  "@fortawesome/react-fontawesome"
  "@fortawesome/fontawesome-svg-core"
```

To help ensure a clean install of the new `react-fontawesome` and `fontawesome-svg-core` packages, consider removing any existing
entries for `@fortawesome/fontawesome-svg-core` and `@fortawesome/react-fontawesome` from your `node_modules` directory and your
lock file (`package-lock.json` if using npm, or `yarn.lock` if using Yarn) before reinstalling.

## 2. Ready for Reinstallation

Next, head over to the [Set Up with React](/web/use-with/react.md#1-add-the-react-component) guide. Take a moment to decide whether you'd
like to install using a Kit Package (recommended) or SVG Icon Packages, and just follow the steps for the option that works best
for you.

## Optional: Updating v6 Pro Icon Packages

All v6 icon packages are still compatible with the new `react-fontawesome` and `fontawesome-svg-core` packages.

However, if you'd like to upgrade to the latest v7 icon packages, simply follow the same steps as above: remove the
existing icon packages from your package.json (and yarn.lock if applicable), then reinstall the
[Icon Packages](/web/use-with/react.md#3-add-icon-packages).