DEV Community

Paul C. Ishaili
Paul C. Ishaili

Posted on

Dynamically Adding FontAwesome Icons in NextJS

There are a diverse ways in adding FontAwesome in a NextJS Project.

Here is my favourite and most recommended approach.

Install the following:


1. ๐Ÿ‘‰ React FontAwesome

npm install @fortawesome/react-fontawesome
Enter fullscreen mode Exit fullscreen mode

or

yarn add  @fortawesome/react-fontawesome
Enter fullscreen mode Exit fullscreen mode

2. ๐Ÿ‘‰ FontAwesome SVG Core

npm install @fortawesome/fontawesome-svg-core
Enter fullscreen mode Exit fullscreen mode

or

yarn add  @fortawesome/fontawesome-svg-core
Enter fullscreen mode Exit fullscreen mode

3. ๐Ÿ‘‰ Fontawesome Free SVG Solid Icons

npm install @fortawesome/free-solid-svg-icons
Enter fullscreen mode Exit fullscreen mode

or

yarn add  @fortawesome/free-solid-svg-icons
Enter fullscreen mode Exit fullscreen mode

4. ๐Ÿ‘‰ FontAwesome Free Brand Icons

npm install @fortawesome/free-brands-svg-icons
Enter fullscreen mode Exit fullscreen mode

or

yarn add  @fortawesome/free-brands-svg-icons
Enter fullscreen mode Exit fullscreen mode

Top comments (0)