免费工具 ICO 图标生成器：网站 favicon 一次做齐
用 logo 图片、一两个字或一个 emoji 做起点。本页把浏览器标签页、手机桌面、Google 搜索结果要用到的每个尺寸都画出来，打包成真正的多尺寸 favicon.ico，写好 site.webmanifest，再给你一段贴进 <head> 的标签。
- 图片、文字、emoji 都行
- 尺寸按 Google、Apple 文档
- 在本机生成
设计你的网站图标
改任何一项，所有尺寸都会重画。重点看 16 像素的预览，浏览器标签页上大多数人看到的就是它。
从哪里开始
emoji 用的是你系统自带的 emoji 字体，所以在苹果、Windows、安卓设备上画出来的样子不同。这些厂商的 emoji 图形有各自的授权条款；商用的话，Twemoji（CC BY 4.0）、Noto Emoji（Apache 2.0）这类开源图标更稳妥。
形状
预览
手机桌面：iOS 会自己给 apple-touch-icon 加圆角；安卓会把 maskable 图标裁成系统的形状。
16 和 32 像素放大 3 倍、按像素显示。苹果触屏图标始终是不透明的正方形，透明部分会填成白色。
写进 manifest 的网站信息
<link rel="icon" href="/favicon.ico" sizes="16x16 32x32 48x48">
<link rel="icon" type="image/png" sizes="96x96" href="/favicon-96x96.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">
<meta name="theme-color" content="#2563eb">{
"name": "我的网站",
"short_name": "我的网站",
"icons": [
{
"src": "/icon-192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "/icon-512.png",
"sizes": "512x512",
"type": "image/png"
}
],
"theme_color": "#2563eb",
"background_color": "#2563eb",
"display": "standalone",
"start_url": "/"
}文件
上传到网站根目录（或你填的路径），再把上面的标签贴进页面。不管放在哪，favicon.ico 都要放根目录：页面没有声明图标时，浏览器会去请求 /favicon.ico。
-
favicon.ico16 / 32 / 48 浏览器标签页、收藏夹、Windows -
favicon-96x96.png96 × 96 Google 搜索结果（大于 48 像素） -
apple-touch-icon.png180 × 180 iPhone、iPad 添加到主屏幕 -
icon-192.png192 × 192 安卓主屏幕、安装成应用 -
icon-512.png512 × 512 安卓主屏幕、安装成应用 -
icon-maskable-512.png512 × 512 安卓自适应图标形状 -
site.webmanifestJSON 网页应用清单
正在画图标…
版本 v1.0更新于 更新记录
每个文件分别用在哪
favicon 没有「唯一正确的尺寸」：显示图标的每个地方找的是不同的文件。
favicon.ico（16、32、48）
浏览器标签页、收藏夹、历史记录；页面没有声明图标时，浏览器请求的 /favicon.ico 也是它。一个 ICO 文件里装着三个尺寸，浏览器挑最接近需要的那个。
favicon-96x96.png
给 Google 搜索用的大一点的 PNG。Google 要求正方形、至少 8 × 8 像素，并建议大于 48 × 48，在各种界面上才清楚。
apple-touch-icon.png（180）
iPhone、iPad 上「添加到主屏幕」时显示的图标。Apple 的文档里 Retina iPhone 用 180 × 180。圆角由 iOS 自己加，所以文件是完整的正方形。
icon-192 / icon-512 和 manifest
Chromium 内核浏览器要求 manifest 里至少有 192 和 512 像素的图标，网站才能以图标形式出现在安卓桌面、或被安装成应用。maskable 版本裁成圆形、圆角方形时不会切掉 logo。
搜索引擎会缓存网站图标。换了新图标后，Google 可能要几天到几周才显示新的；Google 的文档说可以在 Search Console 用「网址检查」请求重新编入首页。百度没有公开 favicon 的尺寸规范（2026-11-10 查询），按上面这套做即可。
四步给网站加上 ICO 图标
大约五分钟，大部分时间在上传文件。
-
1
设计
选「图片」「文字」或「Emoji」。用 logo 的话，准备一张 512 像素以上的正方形 PNG 或 SVG。越简单越好，细节在 16 像素下会消失。
-
2
看小尺寸
看放大后的 16、32 像素预览和两个浏览器标签页。看不清就加大留白，或者换成一个加粗的字。
-
3
下载并上传
下载 ZIP，把文件传到网站根目录；用的是别的文件夹就改「图标所在路径」。favicon.ico 留在根目录。宝塔面板可以在「网站 → 根目录」里直接上传。
-
4
贴标签
把标签复制到每个页面的 <head> 里（一般是公共模板或布局文件）。打开网站看标签页；还是旧图标就强制刷新。
Google、Apple 和浏览器分别要什么
本工具的尺寸都来自各家自己的文档，2026 年 11 月 10 日核对。
- Google 搜索：正方形，至少 8 × 8，建议大于 48 × 48；每个主机名只认一个图标；Googlebot 要能抓首页、Googlebot-Image 要能抓图标文件
- Google 认的 rel 写法：
icon、shortcut icon、apple-touch-icon、apple-touch-icon-precomposed - ICO 文件：6 字节文件头 + 每个尺寸一条 16 字节的目录 + 图像数据；Windows Vista 起每张图可以直接是完整的 PNG 文件，本工具就是这样写的
- 网页应用清单（manifest）：要有
name或short_name、start_url，每个图标写src、sizes、type
| 用在哪 | 尺寸 | 出处 |
|---|---|---|
| Google 搜索结果 | 正方形，≥ 8 像素；建议 > 48 像素 | Google 搜索中心 favicon 指南 |
| 浏览器标签页（ICO） | 16、32、48 像素 | Microsoft 图标说明：建议至少包含 16、32、48 |
| iPhone 主屏幕 | 180 × 180 | Apple Safari Web Content Guide |
| 安卓 / 安装成应用 | 192 × 192 和 512 × 512 | web.dev 网页应用清单 |
| maskable 图标 | 512 × 512，图案在宽 80% 的圆内 | W3C Web App Manifest 图标遮罩 |
本工具生成的 favicon.ico 里面是什么
ICO 文件是一个小目录加若干张图。装 16、32、48 三张 PNG 时，前 54 个字节是文件头和目录。
| 字节 | 字段 | 值 |
|---|---|---|
| 0–1 | 保留 | 0 |
| 2–3 | 类型 | 1（图标；2 是鼠标指针） |
| 4–5 | 图像个数 | 3 |
| 6–21 | 第 1 条目录：宽、高、颜色数、保留、位面、位深、大小、偏移 | 16、16、0、0、1、32、PNG 长度、54 |
| 22–37 | 第 2 条目录 | 32 × 32，偏移 = 54 + 16 像素 PNG 的长度 |
| 38–53 | 第 3 条目录 | 48 × 48，偏移在 32 像素 PNG 之后 |
| 54 起 | 图像数据 | 三个完整的 PNG 文件首尾相接 |
宽和高各占 1 个字节，所以 256 像素写成 0。把 PNG 直接改名成 .ico 并不会产生这个结构，文件本身仍然只是一张 PNG。
网站图标为什么不显示
「favicon 不显示」大多是下面几种原因。
robots.txt 挡住了图标
Google 要用 Googlebot-Image 抓图标、用 Googlebot 抓首页。屏蔽了 /images/ 或 /static/ 目录，搜索结果里就可能不显示。
把完整 logo 缩到 16 像素
带文字的长 logo、细线条缩小后糊成一团。只用图形部分，或者一两个加粗的字。
以为换了马上生效
浏览器和搜索引擎都会缓存图标。强制刷新、改文件名或加版本参数，再给 Google 时间重新抓取。
只放了一张 16 像素的 PNG
手机桌面和高清屏上会发虚。整套都放上：ICO、180、192、512。
图标出现的地方，旁边就是你的数据
网站图标影响你在搜索结果和客服窗口里的样子。TapCub 统计这两处周围的数字。
ICO 图标在线制作要准备什么？
一张正方形的 logo（PNG 或 SVG，512 像素以上为宜），或者直接用一两个字、一个 emoji。在本页选好来源，下载 ZIP，就有 favicon.ico、苹果触屏图标、192 / 512 PNG 和 manifest。
PNG 怎么转成 ICO？
选「图片」，把 PNG 拖进来，下载 favicon.ico。工具会画出 16、32、48 三个尺寸，按 ICO 格式写好图标目录装进一个文件，而不是简单地改扩展名。
favicon 应该做多大？
没有唯一的尺寸：favicon.ico 装 16、32、48；给 Google 搜索一张大于 48 像素的 PNG（本工具做 96）；苹果触屏图标 180；manifest 里放 192 和 512。
为什么 Google 搜索结果里不显示我的图标？
检查首页有没有 link 标签、图标是不是正方形且至少 8 × 8（建议大于 48）、首页和图标有没有被 robots.txt 屏蔽。然后耐心等，Google 重新抓取图标要几天到几周。
现在还需要 favicon.ico 吗？
仍然是最稳妥的后备。页面没有声明图标时，浏览器和很多工具会请求 /favicon.ico，HTML 标准里也写了这个后备行为。即使链接了 PNG 图标，也把它留在根目录。
maskable 图标是什么？
背景铺满整个正方形、图案放在中间安全区（直径为宽度 80% 的圆）里的图标。安卓可以把它裁成圆形、圆角方形等各种形状，而不会切掉 logo。
能用 SVG 做 favicon 吗？
很多浏览器支持 <link rel="icon" type="image/svg+xml">，但支持情况不一，苹果触屏图标和 manifest 图标也要 PNG。本工具生成到处都能用的 PNG + ICO 这一套，需要的话可以再加一条 SVG 链接。
我的 logo 会上传吗？
不会。图片在你的浏览器里打开、画到 canvas 上，ICO、PNG 和 ZIP 都在本机生成。