实用工具
把文件拖到这里
或者点击选择文件。文件只在当前标签页里处理，不会上传到任何服务器。
每个网站都需要那几个图标文件，可大多数生成器还在输出二十几种尺寸，很多年都没有浏览器会去请求它们了。这里只用一张方图生成当下够用的最小集合：包含 16、32、48 像素的 favicon.ico，源文件是 SVG 时附带的 SVG 图标，带实色背景的 180 像素 Apple 触摸图标，给安卓和可安装网页应用的 192、512 像素图标，以及 web manifest——外加一段直接贴进页面 head 的 HTML。
它是怎么工作的
- .ico 容器在页面里逐字节写出，内部装的是 PNG 图像——自 Vista 上的 IE 以来所有浏览器都能读取这种格式。
- 大图按“每次缩一半”的方式逐级缩小，而不是一步到位，这样 16 像素的小图标是整张图的平均，而不是随机采到的几个像素。
- Apple 触摸图标使用你选定的背景色，因为 iOS 会把透明区域填成黑色；其余图标保留透明背景。
你的数据去了哪里
哪也没去。本工具完全在你的浏览器里运行：你粘贴的文本由页面处理，不会传输到任何服务器，也不会写进任何日志。
本工具免费且无需登录，运行结果只存在于你当前的页面里，不会被保存到任何地方。
它要花多少
本工具完全免费，不需要登录，也不消耗积分。
常见问题
- 用什么样的图片最好？
- 方形的 SVG，或者至少 512 × 512 像素的 PNG。非方形图片会居中并在两侧留空，选“铺满裁切”则裁掉多余部分；小于 512 像素的图会被放大用于最大尺寸的图标，看起来会发虚。
- 生成的文件放在哪里？
- 放在网站根目录，让它们可以通过 /favicon.ico、/apple-touch-icon.png 等路径访问——HTML 片段引用的就是这些路径。Next.js 项目放在 public 目录；大多数静态站点生成器是 static 或 public 目录。
- 现在还需要 favicon.ico 吗？
- 需要。RSS 阅读器、一些搜索工具和老浏览器会不看 HTML 直接请求 /favicon.ico，那里 404 的话每次访问都会在日志里留下一条错误。片段里给 ico 写上 sizes="32x32"，是为了让新版 Chrome 在有 SVG 图标时优先用 SVG。
- 图标内边距是做什么用的？
- 安卓可能把应用图标裁成圆形或圆角方形，四个角会被切掉。留大约 10% 的内边距，贴边的 Logo 就能待在安全区里；如果只是浏览器标签上的 favicon，不留边距才能用满那 16 个像素。
背后的开源项目
本工具是独立实现，并未打包第三方库。itgalaxy/favicons（MIT）在代码层面做的是同一件事——如果你需要在自己的程序里实现它，从那里开始，而不是调用一个网页。
itgalaxy/favicons也常被称作
- favicon生成
- 网站图标生成
- png转ico
- ico图标在线制作
- favicon.ico制作
- apple-touch-icon生成