DEV Community

Paul C. Ishaili
Paul C. Ishaili

Posted on

Dynamically Adding FontAwesome Icons in NextJS

#nextjs #react #webdev #programming

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)

Read next

arindam_1729 profile image

9 Interesting Open Source Projects You Should Explore Right Now🥷🏻 🎉

Arindam Majumder -

danmugh profile image

Understand Open Graph ( OG ) in Next Js : A Practical Guide

Dan Mugisho M. -

abhinav707 profile image

Building a Scalable Slot Booking System with Redis Distributed Locks

Abhinav -

prince_beec5ccde00b7c6c73 profile image

Logo's designing effect in html css

Prince -