220

I've created a small app that is basically just a favourites that sits in my system tray so that I can open often-used sites/folders/files from the same place. Getting the default icons from my system for known file types isn't terribly complicated, but I don't know how to get the favicon from a website. (SO has the grey->orange stack icon in the address bar for instance)

Does anyone know how I might go about that?

2
  • 1
    I'm not sure how easy (or possible) it would be to automate the loading/parsing of this page, but it seems to have everything: Favicon-Checker. At the very least, you can use it as a reference/check. Commented Jul 7, 2019 at 18:38
  • 1
    Favicon Kit lets you get & embed favicons like regular images, in sizes much larger than 16 pixels, if available. (Disclosure: I’m the author) Commented Feb 29, 2020 at 21:29

19 Answers 19

393

You'll want to tackle this a few ways:

  1. Look for the favicon.ico at the root of the domain

    www.domain.com/favicon.ico

  2. Look for a <link> tag with the rel="shortcut icon" attribute

    <link rel="shortcut icon" href="/favicon.ico" />

  3. Look for a <link> tag with the rel="icon" attribute

    <link rel="icon" href="/favicon.png" />

The latter two will usually yield a higher quality image.


Just to cover all of the bases, there are device specific icon files that might yield higher quality images since these devices usually have larger icons on the device than a browser would need:

<link rel="apple-touch-icon" href="images/touch.png" />

<link rel="apple-touch-icon-precomposed" href="images/touch.png" />


And to download the icon without caring what the icon is you can use a utility like http://www.google.com/s2/favicons which will do all of the heavy lifting:

var client = new System.Net.WebClient();

client.DownloadFile(
    @"http://www.google.com/s2/favicons?domain=stackoverflow.com",
    "stackoverflow.com.ico");
12
  • 2
    does GetFavIcon still work? when I run your example I get a 400 error
    – Julien
    Commented Apr 19, 2015 at 15:43
  • 42
    if anyone wants an alternative to Google, DuckDuckGo has another solution: icons.duckduckgo.com/ip2/www.stackoverflow.com.ico Commented Jul 10, 2016 at 0:51
  • 1
    @hunter google.com/s2/favicons it is an icon with 16x16 it is terrible icon do you know where to take larger icon ? Commented Feb 13, 2019 at 9:21
  • 3
    @JoseSerodio - Well... that was the first thing I tried, but for the domain I was checking, I just got a "dim/dull" image of a right pointing arrow (greater-than) inside a circle-inside a square. It looked like this, but I checked to make sure I had "domain.com.ico" spelled correctly. Now, by the wonders of the internet, it's working correctly... go figure =) so, Nevermind. Commented Jul 7, 2019 at 19:08
  • 7
    @Abedin.Zhuniqi add the parameter &sz=:size where :size is the size in px, e.g. https://www.google.com/s2/favicons?sz=32&domain_url=stackoverflow.com
    – bzr
    Commented Nov 25, 2020 at 14:10
66

Updated 2020

Here are three services you can use in 2020 onwards

<img height="16" width="16" src='https://icons.duckduckgo.com/ip3/www.google.com.ico' />

<img height="16" width="16" src='http://www.google.com/s2/favicons?domain=www.google.com' />

<img height="16" width="16" src='https://api.statvoo.com/favicon/google.com' />
10
  • 5
    grabicon.com is now paid service starting from $9/mo
    – janot
    Commented Feb 19, 2016 at 18:07
  • 2
    Another one: favicon.allesedv.com <img width="144" height="144" src="//f3.allesedv.com/144/www.stackoverflow.com" /> Commented Aug 9, 2016 at 14:56
  • 1
    Thanks @AO_, im actually using duckduckgo these days, Ive updated my answer
    – Blowsie
    Commented Feb 3, 2020 at 15:32
  • 1
    @AO_ then stavoo api is just a wrapper to the google service
    – vixalien
    Commented May 10, 2020 at 13:20
  • 1
    @saintvixalien I believe this has recently changed for people who don't initialise with an API key, as the servers were getting pounded ;) I use the primary service with an API key and get responses directly without the wrapper. I did test without an API key and it redirects to Google's service as you said..
    – AO_
    Commented May 11, 2020 at 17:19
19

You can use Google S2 Converter.

http://www.google.com/s2/favicons?domain=google.com

Source: http://www.labnol.org/internet/get-favicon-image-of-websites-with-google/4404/

2
18

This question is the first google search result I got when I was searching for website favicon API. So I think it'll be still helpful in the future.

https://icon.horse/icon/[url.hostname] will give you a better site icon.

https://icon.horse/icon/stackoverflow.com

4
10

You can do it without programming in 3 steps:

    1. Just open the web site, right-click and select "view source" to open the HTML code of that site. Then in the text editor search for "favicon" - it will direct you to something looking like

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

    Take the string in href and append it to the web site's base URL (let's assume it is "http://WEBSITE/"), so it looks like

    http://WEBSITE/SOMERELATIVEPATH/favicon.ico

    which is the absolute path to the favicon. If you didn't find it this way, it can be as well in the root in which case the URL is http://WEBSITE/favicon.ico.

    2. Take the URL you determined and insert it into the href-Parameter of the following code:
    <html>
      <head>
       <title>Capture Favicon</title>   
      </head>
      <body>
        <a href='http://WEBSITE/SOMERELATIVEPATH/favicon.ico' alt="Favicon"/>Favicon</a> 
      </body>
    </html>
    
    3. Save this HTML code locally (e.g. on your desktop) as GetFavicon.html and then double-click on it to open it. It will display only a link named Favicon. Right-click on this link and select "Save target as..." to save the Favicon on your local PC - and you're done!
9

Combining answers from my own research and couple of other resources here.

TLDR

  1. DuckDuckGo https://icons.duckduckgo.com/ip2/{hostname}.ico
  2. Google https://www.google.com/s2/favicons?domain_url={hostname}
  3. Yandex https://favicon.yandex.net/favicon/{hostname1}/{hostname2}/
  4. allesedv https://f1.allesedv.com/16/{hostname}

Details + Alternatives

Every website doesn't always have a /favicon.ico depending on how the website is coded.

So, there are a couple of other ways to fetch the icon depending on your requirement. And some are more reliable than the others

  1. get a url to embed the favicon somewhere else:

  2. fetch multiple website favicons together

  3. other alternatives

2
7

The first thing to look for is /favicon.ico in the site root; something like WebClient.DownloadFile() should do fine. However, you can also set the icon in metadata - for SO this is:

<link rel="shortcut icon"
   href="http://sstatic.net/stackoverflow/img/favicon.ico">

and note that alternative icons might be available; the "touch" one tends to be bigger and higher res, for example:

<link rel="apple-touch-icon"
   href="http://sstatic.net/stackoverflow/img/apple-touch-icon.png">

so you would parse that in either the HTML Agility Pack or XmlDocument (if xhtml) and use WebClient.DownloadFile()

Here's some code I've used to obtain this via the agility pack:

var favicon = "/favicon.ico";
var el=root.SelectSingleNode("/html/head/link[@rel='shortcut icon' and @href]");
if (el != null) favicon = el.Attributes["href"].Value;

Note the icon is theirs, not yours.

1
  • 1
    Thanks Marc. I appreciate the example. Wrt the images, I don't intend to modify them or use them for anything other than icons in the context menu beside the shortcut's label. Commented Feb 25, 2011 at 15:43
7

It's a good practice to minimize the number of requests each page needs. So if you need several icons, yandex can do a sprite of favicons in one query. Here is an example http://favicon.yandex.net/favicon/google.com/stackoverflow.com/yandex.net/

0
7

In 2020, using duckduckgo.com's service from the CLI

curl -v https://icons.duckduckgo.com/ip2/<website>.ico > favicon.ico

Example

curl -v https://icons.duckduckgo.com/ip2/www.cdc.gov.ico > favicon.ico
1
  • Worked great for me.
    – conmak
    Commented Jul 1, 2021 at 20:31
6

You can get the favicon URL from the website's HTML.

Here is the favicon element:

<link rel="icon" type="image/png" href="/someimage.png" />

You should use a regular expression here. If no tag found, look for favicon.ico in the site root directory. If nothing found, the site does not have a favicon.

3
HttpWebRequest w = (HttpWebRequest)HttpWebRequest.Create("http://stackoverflow.com/favicon.ico");

w.AllowAutoRedirect = true;

HttpWebResponse r = (HttpWebResponse)w.GetResponse();

System.Drawing.Image ico;
using (Stream s = r.GetResponseStream())
{
    ico = System.Drawing.Image.FromStream(s);
}

ico.Save("favicon.ico");
2

Sometimes we can't get the favicon image with the purposed solution as some websites use .png or other image extensions. Here is the working solution.

  1. Open your website with a firefox browser.
  2. Right-click on the website and click the "View page info" option from the list.
  3. It will open up a dialog and click on the "Media" tab.
  4. In that tab you will see all the images including favicon.
  5. Select the favicon.ico image or click through the images to see which image is used as favicon. Some websites use .png images as well.
  6. Then click on the "Save As" button and you should be good to go.

thanks!

1

This is a late answer, but for completeness: it is difficult to get even close to fetching 90% all favicons.

A while ago I wrote a WordPress plugin which attempts to get closer to 100%.

This is how it works:

  1. It starts by searching existing favicon repositories such as Google favicons and GetFavicons for the favicon.

  2. If none of them returns an icon, the plugin attempts to get the icon itself. This involves traversing several pages on the domain.

  3. The plugin then inspects the physical image file, because on some servers files get returned with the incorrect mime types.

The code is still not perfect because in the details you will find many weird situations: people have wrongly coded paths, e.g. img/favicon.ico where img is not in the root, duplicate headers in HTML output, different server responses from the head and body etc.

The core of the fetching part is here so you can reverse-engineer it, but be aware that validating the response should be done (checking image filetype, mime etc.).

1

The SHGetFileInfo (Check pinvoke.net for the signature) lets you retrieve a small or large icon, just as if you were dealing with a file/folder/Shell item.

0

http://realfavicongenerator.net/favicon_checker?site=http://stackoverflow.com gives you favicon analysis stating which favicons are present in what size. You can process the page information to see which is the best quality favicon, and append it's filename to the URL to get it.

0

You can use Getfv.co :

To retrieve a favicon you can hotlink it at... http://g.etfv.co/[URL]

Example for this page : http://g.etfv.co/https://stackoverflow.com/questions/5119041/how-can-i-get-a-web-sites-favicon

Download content and let's go !

Edit :

Getfv.co and fvicon.com look dead. If you want I found a non free alternative : grabicon.com.

2
  • 3
    Link dead, Error: Not Found
    – tttony
    Commented Dec 30, 2015 at 18:04
  • @tttony Indeed. fvicon.com looks dead too. I will edit my comment with paid content. if you find a working free link, please share it!
    – aloisdg
    Commented Jan 3, 2016 at 9:34
0

Using jquery

var favicon = $("link[rel='shortcut icon']").attr("href") ||
              $("link[rel='icon']").attr("href") || "";
0

Using the network tab in the developer tools of your browser:

1.) clear your cache

2.) open developer tools in your browser (F12) and click over to the network tab so requests are recorded

3.) visit the website

4.) in the search bar above the network requests, search for "favicon"

You should see the requests the browser made to retrieve the favicon images for that website. Alternatively, you can filter requests by type. In this case, choose "image" requests.

Tested in Firefox, Chrome, and Edge.

0

This simply worked for me (see the example below and the link to original answer).

  1. Enter the domain name like https://superuser.com/(must end with '/')
  2. Add favicon.ico to the end like - https://superuser.com/favicon.ico

Then you can save as from there. I found this answer here: https://superuser.com/a/157939/365012

Not the answer you're looking for? Browse other questions tagged or ask your own question.