A favicon, short for "favorite icon," is a small image that represents a website. It typically appears in the browser tab and bookmarks. To add a favicon to your HTML document, follow these steps:

Create Your Favicon:
- Design a square image for your favicon. The standard size is 16x16 pixels or 32x32 pixels, but you can use a larger size like 64x64 pixels for higher resolution.
- Save the image in a common web format such as .ico, .png, .gif, or .jpg.
Place Favicon in Your Project Directory:
- Save your favicon image in the root directory of your project or in a specific folder (e.g., images).
Add the Favicon Link in the <head> of Your HTML Document:
- Open your HTML file and locate the <head> section.
- Add the following line inside the <head> section:
```
html
<link rel="icon" href="path/to/your/favicon.ico" type="image/x-icon">
```
Replace "path/to/your/favicon.ico" with the actual path to your favicon image.
If your favicon is in a different format (e.g., PNG), you can use:
```
html
<link rel="icon" href="path/to/your/favicon.png" type="image/png">
```
If you want to support multiple sizes and resolutions, you can use the following code, specifying different sizes:
```
html
<link rel="icon" href="path/to/your/favicon-16x16.png" sizes="16x16" type="image/png">
<link rel="icon" href="path/to/your/favicon-32x32.png" sizes="32x32" type="image/png">
```
Save and Test:
- Save your HTML file.
- Open your webpage in a browser, and you should see your favicon in the tab and bookmarks.

Remember to replace "path/to/your/favicon.ico" with the actual path to your favicon image. If your project is hosted online, ensure that the favicon file is accessible from the web by providing the correct path.