Favicon 图标生成器
上传一张高清图片，一键生成所有主流平台 (Web, iOS, Android) 需要的图标尺寸。 包含完整的 HTML 引用代码和 PWA Manifest 配置。
点击上传图片
支持 PNG, JPG, SVG。建议尺寸 512x512 以上。
实时预览
HTML 引用代码
<!-- 在 <head> 中添加 --> <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"> <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png"> <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"> <link rel="manifest" href="/site.webmanifest">
Favicon 最佳实践指南
为什么需要多种尺寸？
浏览器标签页用 16x16，桌面快捷方式用 32x32，iPhone 主屏幕用 180x180。提供完整尺寸能确保你的网站在任何设备上都清晰锐利。
PNG vs ICO
现代浏览器都支持 PNG 格式的 Favicon。ICO 格式主要用于兼容极老版本的 IE (IE 6-10)。我们推荐优先使用 PNG 以获得更好的透明度支持。
各平台图标规范详解
Desktop Browser
浏览器标签页、收藏夹列表、历史记录列表。这是最基础的图标。
iOS / iPhone
当用户将网站“添加到主屏幕”时显示的图标。不支持透明背景（会自动变成黑色），建议使用不透明设计的 Logo。
Android Chrome
配合 Web Manifest 使用。用于 Android 任务切换器、启动画面和 PWA 安装提示。
快速安装指南
下载并解压
点击上方的下载按钮，获得 .zip 压缩包。解压后你会看到一系列 png 文件和 site.webmanifest。
上传到服务器
将所有解压出来的文件上传到你网站的根目录（通常是 public 文件夹）。确保可以通过 yoursite.com/favicon-32x32.png 直接访问。
添加 HTML 代码
复制生成的 HTML 代码片段，粘贴到所有网页的 <head> 标签内。清除浏览器缓存后即可看到效果。
常见问题 FAQ
生成的 zip 包里包含什么？
包含适用于 Web 的 16x16/32x32 PNG，适用于 iOS 的 apple-touch-icon.png，适用于 Android PWA 的 192x192/512x512 图标，以及 site.webmanifest 配置文件。
site.webmanifest 是什么？
它是一个 JSON 文件，告诉浏览器（尤其是 Android Chrome）你的网站在被添加到主屏幕时应该表现得像一个原生 App。我们为您自动生成了这个文件。
如何使用这些图标？
下载 zip 包，解压所有文件到你网站的根目录（public 文件夹），然后复制页面上提供的 HTML 代码到你的 <head> 标签中即可。