How to change Angular CLI favicon

angular-cli
user4914839 picture user4914839 · Nov 26, 2016 · Viewed 172k times · Source

How can I change the default favicon that is set by the Angular CLI?

I have tried many things, but it always shows the Angular logo as the favicon, even though I have deleted that icon (favicon.ico in src folder). It still shows, and I don't know from where it's loaded from.

I have replaced that icon with another icon, but it still show the Angular logo:

<link rel="icon" type="image/x-icon" href="favicon.ico">

Answer

Sukhveer Singh picture Sukhveer Singh · Apr 7, 2017

Make a png image with same name (favicon.png) and change the name in these files:

index.html:

<link rel="icon" type="image/x-icon" href="favicon.png" />

angular-cli.json:

"assets": [
    "assets",
    "favicon.png" 
],

And you will never see the angular default icon again.

Size should be 32x32, if more than this it will not display.

NOTE: This will not work with Angular 9

For angular 9 you have to put favicon inside assets then give path like

<link rel="icon" type="image/x-icon" href="assets/favicon.png">

Related questions

Could not find module "@angular-devkit/build-angular"

After updating to Angular 6.0.1, I get the following error on ng serve: Could not find module "@angular-devkit/build-angular" from "/home/Projects/myProjectName". Error: Could not find module "@angular-devkit/build-angular" from "/home/Projects/myProjectName". at Object.resolve (/home/Projects/myProjectName/node_…

Read More
How to upgrade Angular CLI to the latest version

Using ng --version I got: @angular/cli: 1.0.0 which is not the latest release available. Since I have Angular CLI globally installed on my system, in order to upgrade it I tried: npm update angular-cli -g But it does not work, …

Read More
ng is not recognized as an internal or external command

Running windows 7 Professional 32bit. I tried running npm install -g angular-cli both under normal or admin. I also tried adding it to the Enviorment Variables under PATH: (C:\Users\Administrator\AppData\Roaming\npm\node_modules\angular-cli\bin\ng) , with no …

Read More