A favicon is a small picture that shows up in the browser tab next to the name of the page.
Table of Contents:
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 https://www.favicon.cc.
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](\"http://www.coderazaa.com/wp-content/uploads/2023/02/fav-example.jpg\")
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:
Example
<!DOCTYPE html>
<html>
<head>
<title>Your Page Title</title>
<link rel=\”icon\” type=\”image/x-icon\” href=\”/img/favicon.ico\”>
</head>
<body><h1>Your Heading</h1>
<p>Your paragraph.</p></body>
</html>
Favicon File Format Support
The supported file formats for favicon images are displayed in the following table:
| Browser | ICO | PNG | GIF | JPEG | SVG |
|---|---|---|---|---|---|
| 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 |