Favicon

Favicon

<!-- Apple -->

<link rel="apple-touch-icon" sizes="60x60" href="/apple-touch-icon-60x60.png">
<link rel="apple-touch-icon" sizes="76x76" href="/apple-touch-icon-76x76.png">
<link rel="apple-touch-icon" sizes="120x120" href="/apple-touch-icon-120x120.png">
<link rel="apple-touch-icon" sizes="152x152" href="/apple-touch-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon-180x180.png">



<!-- Windows -->
<!-- browserconfiguration.xml -->

<?xml version="1.0" encoding="utf-8"?>

<browserconfig>
 <msapplication>
   <tile>
    <square70x70logo src="/mstile-70x70.png"/>
    <square150x150logo src="/mstile-150x150.png"/>
    <square310x310logo src="/mstile-310x310.png"/>
    <wide310x150logo src="/mstile-310x150.png"/>
    <TileColor>#2b5797</TileColor>
    </tile>
</msapplication>
</browserconfig>



<!-- Android, Chrome and Opera -->

<link rel="manifest" href="/manifest.json">

{ "name": "", "short_name": "", "icons": [ { "src": "/android-chrome-192x192.png", "sizes": "192x192", "type": "image/png" }, { "src": "/android-chrome-512x512.png", "sizes": "512x512", "type": "image/png" } ], "theme_color":"#ffffff", "background_color": "#ffffff", "display": "standalone" }


<!-- Safari's pinned tab -->

<link rel="mask-icon" href="your_icon.svg">



<!-- Source -->
https://www.creativebloq.com/illustrator/create-perfect-favicon-12112760