Favicon 转换器
上传一张图片,即可为您的网站生成所有尺寸的 favicon。
点击或拖拽图片到此处
支持 PNG, JPG, SVG, WEBP
一键生成
上传图片即可生成所有尺寸的 favicon,包括 ICO、PNG、SVG 等多种格式
全平台兼容
支持所有浏览器和设备,包括 iOS、Android、Windows 等平台的图标需求
专业品质
自动优化图片质量,生成符合各平台标准的高质量 favicon 文件
什么是Favicon?
Favicon (favorite icon的缩写) 是一个在浏览器标签页、书签和其他界面元素中显示的小图标。它帮助用户在多个打开的标签页和书签中快速识别您的网站。
如何使用Favicon
要将Favicon添加到您的网站,您需要:
- 使用我们的转换工具将图片转换为ICO及其他格式。
- 将下载的ZIP包解压,并把所有文件放在网站的根目录中。
- 在网站的<head>部分添加以下HTML代码:
<link rel="icon" href="/favicon.ico" sizes="any">
<link rel="icon" type="image/png" href="/favicon-16x16.png" sizes="16x16">
<link rel="icon" type="image/png" href="/favicon-32x32.png" sizes="32x32">
<link rel="icon" type="image/png" href="/favicon-48x48.png" sizes="48x48">
<link rel="manifest" href="/site.webmanifest">
<link rel="icon" type="image/png" href="/android-chrome-192x192.png" sizes="192x192">
<link rel="icon" type="image/png" href="/android-chrome-512x512.png" sizes="512x512">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
HTML
最佳实践
- 保持简单: Favicon非常小,复杂的设计会变得难以辨认。
- 品牌一致性: 使用您的Logo或能代表您品牌的标志性元素。
- 考虑不同背景: 确保您的图标在浅色和深色浏览器主题下都清晰可见。
- 提供多种格式: 除了.ico,也提供.png和.svg格式以兼容现代浏览器,就像我们的工具生成的那样。
各种格式说明
ICO 格式 (.ico)
传统的 favicon 格式,兼容所有浏览器包括旧版本的 Internet Explorer。通常包含多个尺寸(16x16, 32x32, 48x48)。
PNG 格式 (.png)
现代浏览器首选格式,支持透明背景,文件小。16x16 用于标签页,32x32 用于任务栏,48x48 用于桌面快捷方式。
Android Chrome 图标
192x192 和 512x512 用于 Android 设备的 PWA(渐进式 Web 应用),当用户将网站添加到主屏幕时显示。
Apple Touch 图标
180x180 专为 iOS 设备(iPhone、iPad)设计,当用户将网站添加到主屏幕时使用。Apple 会自动添加圆角和光泽效果。
Safari 固定标签页图标
SVG 格式的单色矢量图标,用于 Safari 浏览器的固定标签页功能,支持自定义颜色。
SVG 格式 (.svg)
现代矢量格式,可无限缩放不失真,支持暗黑模式适配,文件体积小,是未来的趋势。