Angular Activity
  • Initial page
  • Angular 7 - Bootstrap 4
  • Angular 7 - Flag Icon CSS
  • Angular 7 - Font Awesome 5
  • Angular 7 - Animate CSS
Powered by GitBook
On this page
  • Step 0
  • Step 1
  • Step 2
  • Step 3
  • Step 4

Was this helpful?

Angular 7 - Font Awesome 5

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

PreviousAngular 7 - Flag Icon CSSNextAngular 7 - Animate CSS

Last updated 6 years ago

Was this helpful?

🎬Video version:

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
https://www.youtube.com/watch?v=wTOzRfWzdcQ
Angular 7 - Font Awesome 5
angellist icon right to the Welcome to angular7app! title.