ImgConvert

网站 Favicon 图标生成器

用一张图片生成 ZIP,包含一个多尺寸 ICO、五张 PNG 图标和一个网页应用清单。可参考下方安装代码,将这些文件接入网站。

拖拽图片到这里,或选择文件上传(支持 PNG、JPG、SVG、WebP、GIF)。建议尺寸:512×512px 或更大。

下载包包含

  • • 一个包含 16、32、48 px 尺寸的 ICO
  • • 五张用于浏览器和主屏幕的 PNG 图标
  • • 一份需要按网站信息调整的网页应用清单

Favicon 压缩包包含什么

下载结果为 favicon-package.zip,内含七个文件。HTML 是本文提供的安装示例,不是 ZIP 内的文件。

文件尺寸或内容用途
favicon.ico一个文件包含 16×16、32×32 和 48×48网站多尺寸图标。
favicon-16x16.png16×16小尺寸浏览器图标。
favicon-32x32.png32×32较大尺寸的浏览器图标。
apple-touch-icon.png180×180Apple 主屏幕图标引用。
android-chrome-192x192.png192×192供网页应用清单引用的图标。
android-chrome-512x512.png512×512供网页应用清单引用的较大图标。
manifest.json站点名称、颜色和两条图标引用需要按自己网站检查和调整的初始清单。

支持 PNG、JPG/JPEG、WebP、GIF 或 SVG 输入,输出为静态 ICO 和 PNG;上传 SVG 不会生成 SVG favicon。

生成并安装网站图标

1

选择容易辨认的原图

上传简洁的图片。最大的 PNG 输出为 512×512,建议使用至少该尺寸的正方形原图;单纯放大图片无法改善不清楚的设计。

2

生成并下载 ZIP

点击“生成 Favicon 包”,完成后下载,并在添加到网站前解压。

3

检查清单并部署文件

按需要修改 manifest.json 中的默认名称和颜色。把文件放到网站可公开访问的地址;放在子目录时要同步修改路径。

4

加入 HTML 引用并检查

参考下方示例,把代码放到页面 head 部分。确认图标和清单 URL 可访问,再查看浏览器中的图标。

把图标添加到网站

以下示例假设文件从网站根路径提供。在页面 head 中添加这些引用,并按实际部署位置修改路径。

<link rel="icon" href="/favicon.ico">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="manifest" href="/manifest.json">
<meta name="theme-color" content="#ffffff">

发布前检查以下项目:

检查项处理方式
公开文件路径开头的斜杠代表网站根路径。使用子目录时,同时修改 HTML 的 href 和 manifest.json 内图标的 src。
清单默认值生成的 name 和 short_name 为 My Website,theme_color 和 background_color 为 #ffffff。下载后按需修改;这些字段不会给图标图片本身换色。
网站已有配置检查主题或框架是否还声明了其他图标,避免更新后仍保留指向旧 favicon 的配置。

带有图标的 manifest 不等于完整的可安装或离线网页应用。本生成器不提供 service worker,也不保证所有设备都能安装网站。

让小尺寸图标清晰可辨

🔎
检查 16×16 的实际效果

小字和细线可能看不清。优先使用简单标志、清楚的对比,并在主体周围留出适当空间。

↔
检查形状与留白

非正方形原图会按比例放入正方形画布,空白处透明填充;小图可能被放大。需要精确构图时,请先准备好正方形原图。

按任务选择图标输出

本页根据已有图片生成网站 favicon 文件,不提供绘制 Logo 的功能。

只需要一个 ICO 文件?

可使用 PNG 转 ICO,完成单个格式转换,无需整套网站文件。

正在开发原生手机应用?

可使用应用图标生成器获取原生 iOS/Android 图片资源;它们与网站 favicon 的用途不同。

图片会上传到服务器处理。完成后请及时下载 ZIP;临时文件按服务清理机制处理。

Favicon 安装常见问题

不包含。SVG 是可上传的源格式,输出包包含像素 PNG 和 ICO,不会生成矢量或动画 favicon。

先确认部署后的文件 URL 和页面图标声明正确。浏览器可能缓存 favicon;确认网站已指向新文件后,可用新的浏览器会话检查。

当前表单只选择图片。请在下载的清单中修改 name、short_name、theme_color 和 background_color,并让 HTML 中的 theme-color 与之保持一致。

不能。它提供图标文件和初始清单。安装与离线功能还需要网站的其他配置,不会由这个包自动补齐。

为网站生成 Favicon 文件

选择图片,生成 ZIP,再检查安装路径和站点配置。