Search code examples
htmlgoogle-chromemozillafavicon

Can I make Chrome or Mozilla have a favicon for local files like PDF or similar?


The thing is that there is just the generic favicon of a faviconless page. Any solution is valid, like adding html to the loaded file or configs of the browser.


Solution

  • You could create a HTML page which has a favicon and just add an iframe to it. Although this may not be what you wanted but in this example it would show a .png file with the stackoverflow icon.

    body {
      margin: 0px;
      padding: 0px;
    }
    
    * > iframe.maxsize {
      position: fixed;
      width: 100%;
      height: 100%;
    }
    
    .maxsize {
      display: block;
      width: 100%;
      height: 100%;
      border: none;
    }
    <!DOCTYPE html>
    <html lang="en">
    
    <head>
      <meta charset="UTF-8">
    
      <title>My File</title>
    
      <link href="https://www.google.com/s2/favicons?domain=stackoverflow.com" rel="icon">
    </head>
    
    <body>
      <iframe src="https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png" class="maxsize">
            Your browser does not support iframes!
        </iframe>
    </body>
    
    </html>