Favicon 生成工具
正方形图片效果最佳。支持 PNG、JPG、SVG 和 WebP。
背景
相关外部工具
部分链接为联盟营销链接。
相关工具
将任意图片转换为完整的 favicon 集合——浏览器在标签页、书签和手机主屏幕上显示的小图标。上传图片,下载各尺寸的 PNG,并复制现成的 HTML 和 manifest 代码片段添加到您的网站。一切在浏览器中完成,图片不会上传。
使用方法
- 选择图片——正方形的 logo 或图标效果最佳。
- 为图标选择透明或白色背景。
- 下载各尺寸的 PNG,并将 HTML 和 manifest 代码片段复制到您的网站。
工作原理
您的图片会以所需的每种尺寸绘制到画布上——浏览器标签页用 16 和 32 像素,Windows 用 48 像素,Apple 触控图标用 180 像素,Android 和 PWA 用 192 和 512 像素。从一张大的正方形源图片缩小可保持图标清晰。HTML 代码片段会告诉浏览器每个文件的位置。
功能
所需的每种尺寸
一次性生成完整集合——16、32、48、180、192 和 512 像素。
浏览器、Apple 与 Android 支持
不仅包含经典的标签页 favicon,还包含 apple-touch-icon 和 Android/PWA 图标。
现成的代码片段
复制 HTML link 标签和精简的 site.webmanifest,粘贴即用。
透明或白色背景
根据图标需求保留透明效果或统一为白色背景。
完全本地化
图片在浏览器中处理,不会发送到任何服务器。
使用场景
新网站
在网站上线时添加精美的 favicon,让浏览器标签页显示完整。
PWA 图标
生成渐进式网页应用主屏幕所需的 192 和 512 像素图标。
品牌重塑
品牌更新时,一次性替换所有 favicon 尺寸的新 logo。
博客或作品集
为个人网站添加易于识别的图标,在众多标签页中脱颖而出。
注意事项
- 正方形源图片可避免拉伸;非正方形图片会居中并添加内边距。
- 透明背景在 PNG 输出中得以保留。
- 将下载的文件放在网站根目录下,并在页面 head 中添加代码片段。
- 所有处理均在您的设备上运行,图片不会上传。
常见问题
- 还需要 .ico 文件吗?
- 现代浏览器可通过此处提供的 link 标签接受 PNG favicon,因此 .ico 通常不是必须的。16 和 32 像素的 PNG 即可覆盖标签页图标。
- 会生成哪些尺寸?
- 浏览器用 16、32 和 48,Apple 触控图标用 180,Android 和渐进式网页应用用 192 和 512 像素。
- 可以保留透明效果吗?
- 可以。选择透明背景,PNG 将保留其 alpha 通道。选择白色可将透明区域统一为白色背景。
- 如何添加到网站?
- 将下载的文件放在网站根目录,然后将 HTML 代码片段粘贴到各页面的 head 中,PWA 还需添加 manifest。
- 图片会发送到服务器吗?
- 不会。图片完全在浏览器中处理,不会离开您的设备。