How to replace favicon.ico with SVG in Angular

Replace favicon.ico with favicon.svg in Angular App

Steps

  1. Create a favicon.svg file in the src folder.
  2. In the index.html file, replace the favicon.ico with favicon.svg.

Replace

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

with

<link rel="icon" type="image/svg+xml" sizes="any" href="favicon.svg">

In angular.json search for favicon.ico and replace it with favicon.svg in assets array.

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

References