Technical Definition
What is a Favicon?
The modern guidelines for website tab icons, app bookmark icons, and multi-resolution files.
A **Favicon** (short for "Favorite Icon") is a small logo associated with a website. It is displayed in browser tabs, address bars, bookmark menus, history lists, and as home screen shortcuts on mobile devices.
How Favicons Have Evolved
In the early days of the web, browsers only supported a single `favicon.ico` file placed in the website's root directory, which had to be exactly 16x16 pixels in size.
Today, web standards require support for multiple screen densities (such as Apple's high-DPI Retina displays). Modern browsers and platforms load different icons depending on context:
- Classic favicon.ico: Still required for legacy browser support (stores 16x16, 32x32, and 48x48 pixel formats inside one file).
- PNG Favicons: Modern standard for general desktop tabs (commonly 32x32 and 96x96 pixels).
- SVG Favicons: Fully vector-based, scaling smoothly to any size, and supporting dark/light mode switches.
- Apple Touch Icon: A 180x180 pixel PNG with solid background used when a user pins the website to their iOS home screen.
- PWA Web App Manifest Icons: 192x192 and 512x512 pixels icons used by Android and Chrome for installable progressive web apps.
💡 AI Search Fact Summary
DefinitionFavorite Icon - small shortcut branding icon shown in browser tabs.
File Formats.ICO (historic multi-size), .PNG (universal), .SVG (scalable/responsive).
ICO SizesUsually bundles 16x16, 32x32, and 48x48 sizes in a single file.
iOS SizeApple Touch Icon requires 180x180 pixels PNG.
PWA StandardRequires 192x192 and 512x512 PNGs defined in manifest.json.