Scribd
Upload
4 views

HTML Favicon

A favicon is a small image displayed next to the page title in a browser tab, which can be added to a website using the <link> element in the HTML. The favicon image should be saved in the root directory or an 'images' folder, commonly named 'favicon.ico'. Supported file formats for favicons include ICO, PNG, GIF, JPEG, and SVG across major browsers.

Uploaded by

Asif Ali
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
4 views

HTML Favicon

A favicon is a small image displayed next to the page title in a browser tab, which can be added to a website using the <link> element in the HTML. The favicon image should be saved in the root directory or an 'images' folder, commonly named 'favicon.ico'. Supported file formats for favicons include ICO, PNG, GIF, JPEG, and SVG across major browsers.

Uploaded by

Asif Ali
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 6

 Tutorials  Exercises  Services   Sign Up Log in

HTML
 CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++

HTML Favicon
❮ Previous Next ❯

A favicon is a small image displayed next to the page title in the browser tab.

How To Add a Favicon in HTML


You can use any image you like as your favicon. You can also create your own favicon on sites
like https://www.favicon.cc.

Tip: A favicon is a small image, so it should be a simple image with high contrast.

A favicon image is displayed to the left of the page title in the browser tab, like this:

To add a favicon to your website, either save your favicon image to the root directory of your
webserver, or create a folder in the root directory called images, and save your favicon image in
this folder. A common name for a favicon image is "favicon.ico".

Next, add a <link> element to your "index.html" file, after the <title> element, like this:

Example

<!DOCTYPE html>
<html>
<head>
 <title>My
TutorialsPage
 Exercises 
Title</title> Services   Sign Up Log in
<link rel="icon" type="image/x-icon" href="/images/favicon.ico">
HTML CSS
 </head> JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++
<body>

<h1>This is a Heading</h1>
<p>This is a paragraph.</p>

</body>
</html>

Now, save the "index.html" file and reload it in your browser. Your browser tab should now
display your favicon image to the left of the page title.

Favicon File Format Support


The following table shows the file format support for a favicon image:

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

Chapter Summary
Use the HTML <link> element to insert a favicon

?
Exercise
In which HTML element is the Favicon defined?
 The <img> element
Tutorials  Exercises  Services   Sign Up Log in

HTML
 CSS The JAVASCRIPT
<body> elementSQL PYTHON JAVA PHP HOW TO W3.CSS C C++

The <link> element

The <style> element

Submit Answer »

HTML Link Tag


Tag Description

<link> Defines the relationship between a document and an external resource

For a complete list of all available HTML tags, visit our HTML Tag Reference.

❮ Previous Next ❯

Track your progress - it's free! Sign Up Log in

ADVERTISEMENT
 Tutorials  Exercises  Services   Sign Up Log in

HTML
 CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++

COLOR PICKER



ADVERTISEMENT

ADVERTISEMENT
 Tutorials  Exercises  Services   Sign Up Log in

HTML
 CSS
 JAVASCRIPT
PLUS
SQL PYTHON
SPACES
JAVA PHP HOW TO W3.CSS C C++

GET CERTIFIED FOR TEACHERS

FOR BUSINESS CONTACT US

Top Tutorials
HTML Tutorial
CSS Tutorial
JavaScript Tutorial
How To Tutorial
SQL Tutorial
Python Tutorial
W3.CSS Tutorial
Bootstrap Tutorial
PHP Tutorial
Java Tutorial
C++ Tutorial
jQuery Tutorial

Top References
HTML Reference
CSS Reference
JavaScript Reference
SQL Reference
Python Reference
W3.CSS Reference
Bootstrap Reference
PHP Reference
HTML Colors
Java Reference
Angular Reference
jQuery Reference

Top Examples Get Certified


HTML Examples HTML Certificate
CSS Examples CSS Certificate
JavaScript Examples JavaScript Certificate
How To Examples Front End Certificate
SQL Examples SQL Certificate
Python Examples Python Certificate
W3.CSS Examples PHP Certificate
Bootstrap Examples jQuery Certificate
PHP Examples Java Certificate
Java Examples C++ Certificate
XML Examples C# Certificate
jQuery Examples XML Certificate

    
FORUM ABOUT ACADEMY
 Tutorials  Exercises  Services   Sign Up
W3Schools is optimized for learning and training. Examples might be simplified to improve reading and
Log in

learning.
HTML
 CSS
Tutorials, JAVASCRIPT SQL arePYTHON
references, and examples JAVA to avoid
constantly reviewed PHP errors,
HOW TO cannot
but we W3.CSS
warrant full C C++
correctness
of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie
and privacy policy.

Copyright 1999-2025 by Refsnes Data. All Rights Reserved. W3Schools is Powered by W3.CSS.

You might also like