Favicon 生成器所有尺寸，连同配套的 head 代码。
拖进一个 logo，拿走一份真正的多分辨率 favicon.ico、浏览器要的各个 PNG 尺寸、apple touch icon、安卓的 maskable 图标，以及已经填好的 site.webmanifest。全部在这个标签页里生成，图片不会被上传。
把 logo 拖到这里
也可以点击选择文件。512px 以上的正方形图片效果最好。
PNG、JPG、WebP、SVG、ICO 或 GIF
图片的读取、缩放和打包都在这个标签页里完成。它不会被上传，整个过程也没有任何服务器参与。
2026 年真正需要哪些 favicon 尺寸？
比大多数生成器还在塞给你的二十个文件少得多。五个显示位置就能覆盖所有还值得考虑的浏览器和系统，再往上加只是让 <head> 变重。
favicon.ico，16、32 和 48
浏览器还没读到第一行 HTML，就会先去域名根目录找这个文件。一个容器装下三种尺寸，所以这个 favicon 转换工具会构建真正的 .ico，而不是把 PNG 改个后缀。16px 是标签页，32px 是高分屏标签页和书签栏，48px 是 Windows 快捷方式。
favicon.svg，手上有矢量图的话
矢量 favicon 在任何尺寸下都清晰，文件里写一条媒体查询，甚至能跟着系统深色模式变化。支持它的浏览器会优先用它，而不是 .ico。在这里上传 SVG，它会一直是矢量，不会被栅格化再当成矢量还给你。
apple-touch-icon.png，180×180
有人把你的网站添加到主屏幕时，iOS 用的就是这个图标。一个文件就够：从 iOS 8 起系统会自己把一张 180px 图标缩下去，当年从 apple-touch-icon-57x57 排到 152x152 的那一摞早就是多余的。这里只写一个，并且做成不透明。
android-chrome 192 和 512，外加 maskable
它们是从 site.webmanifest 里引用的，不是从 link 标签。192px 用于主屏幕，512px 用于启动画面和安装提示。maskable 那一版会被安卓按启动器的形状裁切，所以图形必须留出真正的边距。
mstile-150x150.png，留着也不亏
Windows 上固定的网站还会读它。代价只是一张小 PNG 和两个 meta 标签，所以顺手带上，删掉也不会坏事。这是老实话，也是它排在最后、而不是被说成必需品的原因。
为什么一个 .ico 文件里装着好几张图？
因为 .ico 是容器格式，不是图片格式。明白这一点，就是“到处都能正常显示的 favicon”和“在 Windows 与订阅阅读器里悄悄失效的 favicon”之间的差别。
先是目录，然后才是图像
文件开头是 6 字节的头部，说明后面跟着几张图；接着每张图各占一条 16 字节的条目，写明宽、高、字节长度和它在文件里的偏移；再往后才是图像数据。全部是小端序。正因为有这个结构，把 PNG 改名成 .ico 并不能变成 .ico。
尺寸由读取方来挑
要画 16px 标签页的浏览器会先读目录，找到 16px 那条，只解码那一张。只给它一张 512px，它就在绘制时现场缩小，采样很廉价，结果发糊。给它一张专门做的 16px，它就直接用。
里面装的可以是 PNG
最初的格式塞的是像素顺序颠倒的 BMP，外加一张单独的 1 位透明遮罩。Vista 之后的所有 Windows 和所有浏览器同样接受容器里的 PNG，这个 ico 转换工具写的就是后者：文件更小，透明通道是真的，也不用老掉牙的编码器。
质量差距体现在 16px
把 1024px 的 logo 一步缩到 16px，参与采样的源像素太少，结果就是一团灰。这个工具在中间画布上逐级折半，1024 到 512、512 到 256，依此类推，让每个像素都出力。小尺寸 favicon 还能认得出来，靠的就是这一点。
现在还需要 apple-touch-icon 吗？
需要，而且它是整套文件里唯一一个规则不一样的。有两点要知道，上面都已经替你处理好了。
iOS 会丢掉你的透明背景
Safari 把主屏幕图标合成在黑色上，而不是合成在壁纸上，所以你精心导出的透明背景 logo，最后会变成一个漂在黑方块上的形状。因此即使其他文件你选了透明，这个工具也始终把 apple-touch-icon 写成不透明背景，默认白色。从 iOS 7 起系统也不再额外加高光，你交出去的样子就是别人看到的样子。
安卓是裁切，不是补白
安卓启动器拿到 maskable 图标后，会按自己的形状裁切，圆形、squircle 或圆角方形，取决于手机。只有中间 80% 是保证能留下的，所以填满画布、顶到边的 logo 会被削掉边缘。这里的 maskable 文件无论你把滑块调到多少都保留 20% 边距，圆形预览会原样告诉你启动器最后留下什么。
怎么把 favicon 装到网站上？
两步，而错误几乎都出在第二步。别凭记忆手写，直接复制工具生成的那段代码。
文件放在根目录
把 favicon.ico 和其余文件放到 index.html 旁边，让它们在 yoursite.com/favicon.ico 上能被访问到。浏览器不用谁告诉它，就会自己去请求这个确切路径，所以放对位置比 link 标签更重要。
head 代码要放在每一个页面
不只是首页。有人从内页进来并把内页加进书签，也应该看到正确的图标。如果站点跑在模板或框架上，这段代码属于公共布局。
.ico 声明时不要写尺寸
用 rel="icon" href="/favicon.ico" sizes="any"。尺寸信息已经在容器里了，在标记里写死一个反而会让浏览器拿不到其他几个。SVG 那一行放在最前面，让支持矢量的浏览器优先选它。
然后强制刷新，两次
favicon 的缓存既激进又和页面分开，旧图标撑过普通刷新好几天都很常见。在下结论说哪里坏了之前，先直接打开 yoursite.com/favicon.ico，确认服务器给出的确实是新文件。
想知道一个已有的二维码或短链接真正指向哪里？ 用二维码解析工具查一下
新站点需要配一条短链接？ 用免费短链接工具生成一条
图标只是第一印象里比较小的那一半。
favicon 是人已经进到你网站之后才看见的东西。更难的活儿是把人带过来的那条链接干的，而那部分通常没人去量。LinkScale 做的就是这件事。
看清访问从哪来
你发出去的每条链接，都能看到点击、国家、设备，以及点击之后发生了什么，而不是别人后台里的一个数字。
事后改目标地址
已经印出去或发出去的链接，之后照样能改指向，不用请任何人更新他们保存的内容。
一个页面装下全部
一个 link in bio 页面，把商店、预约表单和社交账号放在一起，让唯一那条能放的链接走得更远。
Favicon 生成器常见问题
免费，不用注册，没有水印，也不限制你生成多少个文件。你的图片不会被上传：用浏览器自带的 FileReader 读取，画到 canvas 上，再打包成 Blob，全部在页面内完成。这个工具背后没有任何接口，也就没有可以把图片发过去的地方。使用时打开浏览器的网络面板，或者页面加载完之后断网继续用，都能自己验证。
favicon 搞定了。把人带进来的那条链接，是另一半。
LinkScale 是一个链接管理平台，给那些想知道点击之后发生了什么、并且想在不重印任何东西的前提下改掉目标地址的人。
Free 14-day trial on every plan