跳至内容
Monu Tools

Favicon 生成器

将任意图片转换为完整的 favicon 图标集:.ico 文件、多种 PNG 尺寸、Apple touch icon 以及 web manifest,全部在浏览器中生成。

如何使用 Favicon 生成器

  1. 01

    上传一张正方形图片。简单的 logo 或图标效果最佳,图片会在你的浏览器中处理。

  2. 02

    可选择背景颜色并输入网站名称,用于 web manifest。

  3. 03

    下载 ZIP 文件,并将 HTML 代码片段粘贴到页面 head 中。

什么是网站图标

图标是浏览器选项卡、书签和手机主屏幕上显示的小图标。这是一个让网站看起来完整且易于识别的微小细节,现代浏览器需要它的多个版本。

为什么一张图片不够

这就是问题所在:一张图片已经不够了。您需要用于经典浏览器的多尺寸 .ico、单独的 PNG 尺寸、用于 iOS 主屏幕的 Apple 触摸图标、用于 Android 的较大 PNG 以及一个 Web 清单(如果该网站应该可安装)。

该生成器从单个图像构建整个集合,包括真正的多尺寸 .ico,并为您提供准确的 HTML 片段以放入页面头部,因此您无需组装或手写任何内容。

要上传什么图片

为了获得最佳结果,请上传至少 512 像素的方形图像,最好是简单的徽标或标记,而不是详细的照片,因为图标通常显示得非常小。非方形图像居中并填充为方形,因此边缘附近的细节可能最终出现在边缘中。

背景颜色和站点名称

您可以选择设置背景颜色和站点名称。当有人将网站添加到主屏幕时,网站名称将进入所使用的 Web 清单。

在您的浏览器中运行

一切都通过 Canvas API 在您的浏览器本地运行,因此您的图像永远不会上传。您下载包含所有文件和要粘贴的代码片段的 ZIP。

常见问题

favicon 套件包含哪些内容?

包含 16、32 和 48 px 的 favicon.ico,单独的 16 和 32 px PNG 文件,180 px 的 Apple touch icon,用于 Android 的 192 和 512 px PNG 文件,一个 site.webmanifest,以及可粘贴到页面 head 的 HTML 代码片段。

我应该上传什么样的图片?

至少 512 px 的正方形图片效果最佳,最好是简单的 logo 或标识。非正方形图片会被居中并填充为正方形,因此靠近边缘的细节可能会落入留白中。

我的图片会被上传吗?

不会。图标使用 Canvas API 在你的浏览器中生成,因此你的图片绝不会离开你的设备。

来源

报告问题