工具
Favicon 生成器——上传 Logo 一键导出网站图标资源包
上传 PNG、JPG、WebP 或透明 Logo,拖动裁切或等比补边,实时预览 16–512px 在深浅主题下的效果,一键下载 favicon.ico、各尺寸 PNG、apple-touch-icon 与 site.webmanifest——全程只在浏览器内运行。
上传图片
处理地点:解码、裁切与文件生成全部在此浏览器标签页内完成——图片不上传、不留存、不发送,关闭标签页即丢弃。
裁切与背景
拖动移动 · 滚轮或双指缩放 · 方向键微调
尺寸预览
小尺寸——真实像素,浅色与深色底
大尺寸——缩小显示,导出文件为全分辨率
站点信息与 Manifest
网页 head 引用代码
解压后把所有文件放到站点根目录(能以 /favicon.ico 访问到的位置),再把下面标签粘进 <head>:
下载资源包
使用说明
上传一张接近正方形的 Logo——带透明通道的 PNG 效果最好。「裁切填满」从图中框出一个正方形(拖动定位、滚轮或双指缩放);「完整显示(补边)」把整个 Logo 放进正方形并补齐边缘,不拉伸变形。Logo 类图标建议选透明背景;图案在深色浏览器主题下看不清时再填底色。
下载包内是真实的多尺寸 favicon.ico(PNG 压缩的 16/32/48px 条目,现代浏览器全部可读)、favicon-16x16.png、favicon-32x32.png、apple-touch-icon.png(180px)、android-chrome-192x192.png、android-chrome-512x512.png,以及图标文件名与实际导出完全一致的 site.webmanifest。解压后全部放到站点根目录——即便不写标签,浏览器也会自动请求 /favicon.ico 与 /apple-touch-icon.png。
全程本地运行:图片在当前标签页解码(上限 2048px,超大图也不会卡),图标经逐级减半的 canvas 链渲染保证小尺寸清晰,ZIP 在内存中打包。预览块按真实像素展示 16/32/48px 在浅色与深色底上的效果——发布前确认 Logo 在 16px 下仍可辨认。本工具不生成 maskable 图标:Android 安全区裁切需要另一套版式,资源包只含标准图标集合。
相关工具
常见问题
我的图片会被上传吗?
不会。解码、裁切、渲染图标、打包 ZIP 全部在这个浏览器标签页内完成——图片不发送给任何服务器、不由我们落盘、也不写进链接,关闭标签页即丢弃。
生成的 favicon.ico 是真 ICO 吗?
是。它是逐字节构建的正规 ICO 容器,内含 PNG 压缩的 16×16、32×32、48×48 三个条目——Chrome、Edge、Firefox、Safari 都能正常读取。不是把 PNG 改后缀。
为什么要 android-chrome 图标和 site.webmanifest?
Android Chrome 在「添加到主屏幕」和 PWA 安装时使用这组图标。生成的 manifest 引用的文件名与 ZIP 内文件完全一致——android-chrome-192x192.png 与 android-chrome-512x512.png——并写入你填的站点名、主题色与背景色。
透明背景还是自定义底色?
Logo 建议保留透明——能同时适应浅色与深色浏览器主题;只有当图案在深色底下失去辨识度时才填底色。预览块按真实像素同时展示两种底,下载前可直接确认。
会生成 maskable icon 吗?
不会。maskable 图标要求版式在 Android 安全区裁切(约内缩 40% 的圆形)后仍完整,我们没有做安全区适配,与其生成会被裁掉的图标,资源包只导出行为可预期的标准图标集合。