Favicon HTML Code for 2017

Branding plays a vital role in web design. Using favicon helps to established a good feel and brand of your website.

What is favicon?

A favicon literally means favorite icon. This icon is saved on your computer when you add websites to your favorites or bookmark. Nowadays, this also serves as the identity of a website in the smallest version.

Where can I get a favicon?

There are various favicon generator out there. I use www.html-kit.com/favicon/. It works perfectly by uploading an image or a graphic.

HTML Code for Favicon

Place the HTML code inside the <head></head> tag.

.ico favicon

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

.gif favicon

<link rel="icon" type="image/gif" href="animated_favicon1.gif">

combination of .ico and .gif

<link rel="shortcut icon" href="favicon.ico">
<link rel="icon" type="image/gif" href="animated_favicon1.gif">


Favicon for IOS (iPhone) and android phones

I strongly suggest to use this favicon generator tool to make favicon for all browser and mobile.

<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/manifest.json">
<meta name="theme-color" content="#ffffff">

Favicon not showing up? Try these solutions.

  • The URL of the .ico or .gif is wrong
  • The favicon have different file name
  • They are working on a wrong page
  • They do not refresh/clear cache the web page

Note: Favicon don’t work on IE 6. It works when you bookmark the site.

Are you getting started with HTML?

Check out these helpful courses to improve your web development skills. These aren’t free but you can get big discounts you can get an 11-hour training for $10 which is the best deal that you can get. Click here to checkout the latest coupon codes.


Get Big Discount!

Use this voucher code to enroll a course in Udemy.
Click Here for FREE Udemy Coupons.

FREE COURSE! Build Your First Website in 1 Week with HTML5 and CSS3

Since this is a free course, you would expect that many students will enroll. Over 118,000 are happy and you only need to learn HTML and CSS for 3 hours.

I strongly recommend this course if you want to have a good overview of what HTML and CSS is. If you want to be a professional web developer you can jump into other course to get in-depth knowledge of coding. For starters, this is the right place.

preview this course

*Some links may contain affiliate links. I may get small commission from your purchases to fund this website and to avoid annoying ads.