# Favicon size: the dimensions you actually need

> A size table for tabs, phones, web apps and Google results, plus how to make every size from one image.

URL: https://claudegpt.si/news/favicon-size-dimensions-guide  
Published: 2026-10-27T15:09:20.686Z  
Author: ClaudeGPT Si Newsroom  
Section: Guides  
Topics: Favicon size, Favicon, Web development  
Publisher: ClaudeGPT Si

## Key takeaways

- Use 16 and 32 px for browser tabs, 180 px for the Apple touch icon and 192 and 512 px for the web app manifest.
- Google requires a square favicon of at least 8 x 8 px and recommends larger than 48 x 48 px.
- Start from one square image of 512 px or more; the AyeTab Favicon Generator makes every size from it in your browser.

The favicon size you need depends on where the icon appears: 16 and 32 px for browser tabs, 180 px for the Apple touch icon, and 192 and 512 px for web app manifests. Start from one square image of at least 512 px and let a tool such as the free AyeTab Favicon Generator produce every size from it.

## The short answer in a table

| Size | File | Where it shows |
| --- | --- | --- |
| 16 x 16 px | favicon.ico layer or PNG | Browser tabs and bookmarks on standard screens |
| 32 x 32 px | favicon.ico layer or PNG | Tabs on high-density screens |
| 48 x 48 px | favicon.ico layer | Desktop shortcuts; Google suggests going above this |
| 180 x 180 px | PNG | Apple touch icon on iPhone and iPad home screens |
| 192 x 192 px | PNG in the manifest | Android home screens |
| 512 x 512 px | PNG in the manifest | The install icon for web apps |

You do not need every size in the list to have a working favicon. A favicon.ico with 16, 32 and 48 px layers, a 180 px Apple touch icon and the two manifest icons cover nearly every surface.

## What Google asks for

Search results show a small icon next to your site name. Google's own guidelines say the favicon must be square, at least 8 x 8 px, and it recommends going larger than 48 x 48 px so the icon looks good on different surfaces. It accepts ICO, PNG, JPEG, GIF, BMP and a few other formats. The URL should stay stable, and Google uses one favicon per hostname, so a subfolder cannot have its own.

## Why bigger files are fine

Browsers pick the closest size from the icons you list and scale it. MDN notes that when a page has several icon links, the browser uses their type and sizes to choose the best match. iPhones and iPads ignore that choice and look for the apple-touch-icon link instead, which is why the 180 px file is listed separately.

The practical rule: supply large sources and let the device scale down. Scaling a 32 px icon up to 192 px looks blurry; scaling 512 px down looks sharp.

## Design for the smallest size

Most people only ever see your favicon at 16 or 32 px. At that size, thin lines and small text vanish. A few habits help:

- Use the mark from your logo, not the full wordmark.
- Keep strong contrast against both light and dark tab bars.
- Leave a little padding so the shape does not touch the edges.
- Check the 16 px preview before you ship.

## Make every size at once

You can export each size from a design tool, but a generator is faster. The [AyeTab favicon tool](https://app.ayetab.com/tools/favicon-generator) takes one image and previews it at 16, 32, 48, 64, 96, 128, 180, 192, 256 and 512 px at the same time. You can add padding, round the corners or fill the background, then download:

- a favicon.ico with the 16, 32 and 48 px layers
- PNG files for every size
- a site.webmanifest that lists the 192 and 512 px icons
- the HTML link tags, ready to paste

It runs in your browser, so the image is not uploaded, and it is free with no account. The same tool is in the [AyeTab Chrome extension](https://ayetab.com) on every new tab.

If you need an SVG favicon that scales to any size, AyeTab does not export one; RealFaviconGenerator lists SVG among its outputs. For the PNG and ICO sizes above, AyeTab is the quickest route.

## Frequently asked questions

### What is the standard favicon size?

The classic favicon is 16 x 16 px, often packed with 32 and 48 px versions inside favicon.ico. Modern sites add larger PNGs for phones and app installs.

### What size should the source image be?

Square and at least 512 x 512 px. Large sources scale down cleanly; small ones look blurry when scaled up.

### What favicon size does Google use?

Google asks for a square icon of at least 8 x 8 px and recommends going larger than 48 x 48 px.

## Sources

- [Define a favicon to show in search results](https://developers.google.com/search/docs/appearance/favicon-in-search), Google Search Central
- [HTML attribute: rel](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Attributes/rel), MDN Web Docs
- [Favicon Generator](https://app.ayetab.com/tools/favicon-generator), AyeTab
- [AyeTab](https://ayetab.com), AyeTab
- [Favicon generator. For real.](https://realfavicongenerator.net/), RealFaviconGenerator
- [PNG to Favicon Converter](https://favicon.io/favicon-converter/), favicon.io