Angular 7 - Font Awesome 5

In this article, we'll see how to setup Font Awesome 5 in Angular 7.

🎬Video version: https://www.youtube.com/watch?v=wTOzRfWzdcQ

Step 0

Installing angular-cli

Note: you can skip this part if you already have application generated

sudo npm i -g @angular/cli@next
ng new angular7app
cd angular7app

Step 1

  • Open src/index.html and insert this entry in the head section.

 <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.4.1/css/all.css" integrity="sha384-5sAR7xN1Nv6T6+dT2mhtzEpVJvfS3NScPQTrOxhwjIuvcA67KV2R5Jz6kr4abQsz" crossorigin="anonymous">

Step 2

  • Pick an icon in the Font Awesome Icon section. Here we chose angellist.

Step 3

  • Open src/app/app.component.html and add:

 <i class="fab fa-angellist"></i>

Step 4

  • Launch the application:

ng serve -o

Last updated