Favicon 生成器
将任意图片生成多尺寸 .ico / .png favicon 包。
上传图片
PNG / JPG / WebP / SVG · 点击或拖入
没有图片?用文字或 Emoji 一键开始
在 512×512 画布居中绘制,下载后可继续调整尺寸。
尺寸
全部在浏览器本地完成,图片不会上传。
怎么用
- 上传一张图:PNG / JPG / WebP / SVG 都可以,建议用正方形、主体居中的版本。没有图片也可以直接输入一个字或 Emoji 快速开始。
- 勾选尺寸:默认已选中全平台常用档位(16 至 512px),可按需增减。
- 生成并下载:点击生成,得到打包好的 favicon 套件,解压后按说明放进网站根目录。
常见问题
生成的文件要放在哪里?
通常放进网站根目录(与 index.html 同级),浏览器会自动请求 /favicon.ico。PNG 版本则需在 HTML 的 head 里显式声明,写法见下方指南。
favicon.ico 和 PNG favicon 有什么区别?
ICO 是老牌通用格式,兼容性最好,还能在一个文件里塞多个尺寸;PNG 体积更小、支持透明,是现代浏览器的首选。稳妥做法是两者都提供。
为什么改了 favicon 但浏览器还显示旧的?
浏览器会强缓存 favicon。强制刷新(Ctrl/Cmd + Shift + R)通常能解决;站点若用了 CDN,还需要清一次 CDN 缓存。
相关指南
Favicon 完全指南
全平台尺寸规范、favicon.ico 与 PNG/SVG 的取舍、可直接复制的 HTML 声明代码。
Favicon 不显示排查
60 秒快速自检、8 个常见原因(缓存/路径/声明/大小写/CDN)、开发者工具排查法与可直接复制的正确 HTML 写法。
透明背景图标指南
alpha 通道原理、去背景的三种方法、白边与 iOS 补黑底等常见坑,以及 ICO / favicon 转换时如何保留透明。
暗色图标设计指南
深色模式图标怎么做:对比度、亮度分层、强调色提亮三大原则与双变体策略。
App 图标尺寸速查
iOS 主屏与 App Store 1024、Android 自适应图标 108dp 与 Google Play 512、Windows ICO、macOS icns、PWA 图标的尺寸规范与一次生成方法。