网站的最佳网站图标尺寸

网上有几十条推荐。这是实际覆盖 100% 用户的最小集。

5 分钟阅读

Check favicons on any website

Install the FetchFavicon Chrome Extension to extract, preview, and validate favicons instantly.

Install Chrome Extension

浏览器请求什么

桌面浏览器请求 16×16(选项卡)、32×32(书签栏)和 48×48(搜索结果)。三个人幸福地生活在同一个 .ico 文件中。

操作系统要求什么

Windows“开始”菜单和文件资源管理器最多可以请求 256×256。 macOS 更喜欢 .icns,但接受 .ico。将 16、32、48、64、128、256 捆绑到您的 .ico 中以涵盖所有内容。

PWA 和手机要求什么

添加 180×180 (apple-touch-icon) 和 192×192 + 512×512 PNG(网络清单)以进行干净的主屏幕安装。

最小可行集

清单中的多尺寸 favicon.ico + apple-touch-icon.png (180×180) + 512×512 PNG。就是这样。

常见问题

What is the best favicon size for websites?

Ship a multi-size favicon.ico with 16, 32, 48, 64, 128, and 256 pixels. Add 180×180 for Apple and 192/512 PNGs for PWAs.

What favicon size do browsers use in tabs?

Desktop browsers typically request 16×16 for tabs, 32×32 for bookmark bars, and 48×48 for some search results.

What is the minimum favicon setup?

A multi-size favicon.ico plus apple-touch-icon.png (180×180) and a 512×512 PNG in your web manifest.

Do I need a 256×256 favicon?

Yes for Windows shortcuts and high-DPI surfaces. Bundle it inside your .ico file.

相关指南

试用工具

继续阅读