如何用图片制作 Favicon 网站图标
2026-06-06
Favicon 是浏览器标签页、书签或历史记录里页面标题旁的小图标。它是个小细节，但没有它的网站显得没做完，在一排打开的标签里也更难找。好消息是：你能用一张图几秒生成一整套。
为什么需要多个尺寸
不同地方要不同尺寸的图标：浏览器标签用 16×16 和 32×32，有人把网站存到 iPhone 主屏时用 180×180 的 Apple 触摸图标，安卓和 PWA 用 192×192 和 512×512。与其逐个手做，不如用生成器一次产出整套。我们的 Favicon 生成器 正是从一张源图做这件事。
从合适的图开始
用方形、设计简洁醒目的图——精细的细节和小字在 16 像素下会消失。如果源图不是方的，先裁成方形、聚焦核心符号。小尺寸下纯色背景通常比透明更清楚。图片很大的话，事先快速缩小一下更利落。
放到网站上
下载生成的文件，放进网站根目录，并在页面 <head> 里链接：.ico 兼顾旧浏览器，PNG 应对现代设备。想要内联的小图标，也可以把图片转成 Base64 数据 URI 直接嵌入。由于图标在本地生成，你尚未发布的 logo 不会被传到任何地方。