Those are called 'favicon's. It's the small icon for your website displayed within the browser tabs and bookmarks bar. It helps users visually identify your brand.
How do you set it up?
You can use any image (preferably your brand logo) in a 32x32 pixels .PNG format for this. You can also use images in .SVG or .ICO format as well but PNG is the easiest way. It has to be square shaped and the recommended size is 32x32 pixels.
Add the following line within the
<head>section of your webpage.html :<link rel="icon" type="image/png" sizes="32x32" href="favicon.png"/>Remember to replace the
hrefattribute value to the proper location of your favicon.
And that is all. You should now be seeing your own brand logo as the browser icon for your website 🎉. If you need more help generating the favicon in your preferred format, you can visit - favicon.io
Thanks for reading! Have a great day 👍