图片转 ICO:转换差异、边界与常见坑

图片转 ICO 在线转换:生成含 16/32/48/256 多尺寸的 Windows 图标文件,可一次输出多个分辨率供浏览器与系统按场景取用,并自动处理非正方形图片的裁剪或留白。适合制作 favicon、桌面快捷方式与应用图标。除 favicon 外还适配 Windows 快捷方式。

ICO 是 Windows 的图标容器格式,一个文件里可以同时装 16×16、32×32、48×48、256×256 等多个尺寸,让系统在不同场景下挑最合适的一档渲染——这正是 favicon 不糊的关键。本页工具在浏览器本地完成打包。

两种格式的差异对照

维度PNG / JPEG(单尺寸)ICO(多尺寸容器)
容器能力一个文件一个尺寸一个文件多尺寸,最多 255 档
系统取用浏览器自行缩放,可能发糊系统挑选最接近的尺寸渲染
透明通道PNG 支持 8 位 Alpha支持;大尺寸档可内嵌 PNG 保留 Alpha
典型用途网页图片、应用素材favicon、桌面快捷方式、应用图标
尺寸建议按使用场景单点优化16/32/48 必备,256 备用
体积单尺寸较精简多档叠加,但小尺寸占比低
颜色限制无传统 BMP 档需注意调色板(老系统)
浏览器支持全支持全支持(<link rel="icon">)

边界条件

  • ICO 内各档尺寸必须成正方形且为 2 的幂(16/32/48/64/128/256),长宽不等会导致部分系统渲染异常。
  • 16×16 这一档的细节必须重画:直接把 256×256 缩小会糊成一团,需要单独简化图形(去掉细描边、笔画加粗)。
  • 浏览器对 favicon 缓存极顽固,替换后需要换文件名、加版本查询参数或用无痕窗口验证。
  • 深色模式下若图标是深色描边,会与背景融为一体;建议图标自身带浅色底或用双版本切换。

常见坑

  • 只放一个 256×256,浏览器标签页缩放后模糊,误以为生成质量差。
  • 换掉 favicon 文件后看不到变化,其实是浏览器缓存没刷新。
  • 把 JPG 直接转 ICO(JPG 无透明通道),圆形图标外圈出现白底方块。
  • 16×16 档照搬大图缩小,细线条糊成一片,缩小到实际尺寸后完全看不出图形。

相关工具

常见问题

favicon 应该放哪些尺寸?

最少放 16×16、32×32、48×48 三档,现代浏览器标签页主要用 32×32,高分屏会挑更大的。需要"添加到主屏幕"图标时再加 180×180(Apple touch icon,通常单独用 PNG)与 192/512(PWA manifest)。只放一个 256×256 会让标签页图标被缩糊。

为什么 ICO 里可以塞 PNG?

Vista 之后的 Windows 允许 ICO 内部直接存放 PNG 数据(尤其是 256×256 这一档),既保留透明通道又大幅减小体积。小尺寸(16/32)仍建议用传统 BMP 以保证兼容性。