Which favicon files do you need? ICO, PNG, SVG and more
Why you can trust this guide
This page lists the icons you need to implement your favicon correctly. The web is full of resources making the same promise, often listing different icons. This guide is based on tests on real devices and browsers, published in the compatibility results. Anyone can also run the compatibility test.
favicon.ico
The favicon.ico is the oldest and most classic favicon asset. The ICO format is unique: it can contain several images of different sizes, so that the browser picks the version that fits best. The downside is that the whole file, with all its pictures, must be downloaded before any of them can be used.
Microsoft has long specified that favicon.ico should contain 16x16, 32x32 and 48x48 images. How relevant is it today? Modern browsers support PNG and SVG, which are more compact and convenient.
There is, however, one concrete use for favicon.ico: PDF files. Browsers discover favicons through HTML markup, which obviously does not work for non-HTML documents. When you visit https://example.com/some.pdf, the browser looks for /favicon.ico at the root of the site.
PNG favicon
PNG was the default favicon format for many years. With the wide support of SVG favicons, it is less essential today. A single PNG size is enough: 96x96, square and comfortably above the larger-than-48x48 size Google recommends for favicons in search results.
SVG favicon
The SVG favicon is supported by Chrome, Edge, Firefox and Opera, which prefer it when it is available, and since Safari 26 (September 2025) by Safari on macOS and iOS as well. Safari 18 and earlier rely on PNG and ICO for tab icons, and Google Search does not list SVG among its supported favicon formats, so keep those fallbacks declared. An SVG favicon can embed light and dark variants. The dark variant is somewhat limited: for instance, Chrome on Windows only uses it when the operating system is set to a dark theme, and Safari 26 does not apply prefers-color-scheme rules inside an SVG favicon, so it shows the default design.
Apple Touch icon
Apple used to specify many sizes (57, 60, 72, 76, 114, 120, 144, 152, 180). Since iOS 8, a single 180x180 icon is enough. The "precomposed" variant, which prevented iOS from rounding the corners, was phased out with iOS 7 and 8.
Although it is a PNG, the touch icon does not support transparency: iOS fills the transparent regions with black. In short: submit a single, opaque 180x180 touch icon.
Web App Manifest
The Web App Manifest is used by Android Chrome and other Chromium-based browsers. If it is missing, Chrome falls back to the touch icon, which has rounded corners whereas Android typically crops icons into circles. This is why many sites use different designs for iOS and Android.
Chrome expects two icons in the manifest: 192x192 and 512x512. The 512x512 icon is used for "Add to Home screen" and for the splash screen.
What about Windows tiles and the Safari pinned tab?
The Windows Metro tiles (browserconfig.xml) and the Safari mask icon (pinned tabs, and the MacBook Touch Bar era) are legacy: Safari 12 and later use the regular favicon for pinned tabs, and the last Touch Bar MacBook was discontinued in 2023. EasyFaviconGenerator can still generate them as an option for the sites that really need them.
Keep reading
Ready to put this into practice? Create your free favicon in a few minutes, then check your website favicon once it is online.