HTML Favicon Icon

A favicon is a small picture that shows up in the browser tab next to the name of the page.

How to Put a Favicon on an HTML Page

You can make your favicon out of any picture you want. You can also make your own favicon on sites like

Tip: Since a favicon is small, it should be a simple, high-contrast image.

A favicon is a small image that shows up to the left of the page name in the browser tab.

A Picture of a Favicon


fav example

To add a favicon to your website, either save the image to the root directory of your webserver or make a folder called imgin the root directory and save the image there. “favicon.ico” is a common name for a file with a favicon.

After the <title> element, add a <link> element to your “index.php” file, like this:


<!DOCTYPE html>
<title>Your Page Title</title>
<link rel=”icon” type=”image/x-icon” href=”/img/favicon.ico”>

<h1>Your Heading</h1>
<p>Your paragraph.</p>



Favicon File Format Support

The supported file formats for favicon images are displayed in the following table:

Edge Yes Yes Yes Yes Yes
Chrome Yes Yes Yes Yes Yes
Firefox Yes Yes Yes Yes Yes
Opera Yes Yes Yes Yes Yes
Safari Yes Yes Yes Yes Yes
People also search
Scroll to Top