13/07/2025, 18:33 HTML Favicon
Tutorials Exercises Services Sign In
HTML
CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS 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>
https://www.w3schools.com/html/html_favicon.asp 1/5
13/07/2025, 18:33 HTML Favicon
<title>My Page Title</title>
Tutorials
<link
rel="icon"Exercises
Services href="/images/favicon.ico">
type="image/x-icon" Sign In
</head>
HTML
<body>CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C
<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?
https://www.w3schools.com/html/html_favicon.asp 2/5
13/07/2025, 18:33 HTML Favicon
The <img>
Tutorials
element
Exercises Services Sign In
HTML
The <body>
CSS element SQL
JAVASCRIPT PYTHON JAVA PHP HOW TO W3.CSS 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
https://www.w3schools.com/html/html_favicon.asp 3/5
13/07/2025, 18:33 HTML Favicon
Tutorials Exercises Services Sign In
HTML
CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C
COLOR PICKER
PLUS SPACES
GET CERTIFIED FOR TEACHERS
FOR BUSINESS CONTACT US
Top Tutorials
HTML Tutorial
CSS Tutorial
JavaScript Tutorial
https://www.w3schools.com/html/html_favicon.asp 4/5
13/07/2025, 18:33 HTML Favicon
How To Tutorial
Tutorials SQL Tutorial
Exercises
Python Tutorial
Services Sign In
W3.CSS Tutorial
HTML
CSS JAVASCRIPTTutorialSQL
Bootstrap PYTHON JAVA PHP HOW TO W3.CSS C
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
W3Schools is optimized for learning and training. Examples might be simplified to improve
reading and learning.
Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot
warrant full 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.
https://www.w3schools.com/html/html_favicon.asp 5/5
