Favicon 生成器

Favicon是显示在浏览器标签页中的小图标，它出现在书签和历史记录中您的网站旁边，也会出现在搜索结果旁边。它很小，但却是您的品牌最显眼的元素之一。每当有人在您的网站上打开一个标签页时，那个小方块是他们最先注意到的，这就是为什么一个清晰、易识别的favicon远比它的尺寸所暗示的更重要。使用这款工具，只需一张好图片和几次点击即可完成。

大多数人没想到的是：单个favicon很少够用。桌面浏览器会请求16和32像素的favicon，安卓设备和渐进式Web应用使用192和512像素，iOS主屏幕需要大型触摸图标，应用商店则要求1024像素的图片。手动将Logo调整到所有这些尺寸意味着打开设计软件、调整画布大小并逐一导出文件。这个favicon生成器可在几秒钟内为您完成所有这些工作，将一张上传的图片转换成八个尺寸合适的PNG图标。

上传图片后，生成器会生成16x16、32x32、48x48、64x64、128x128、192x192、512x512和1024x1024像素的图标。这套尺寸几乎覆盖了您会遇到的所有情况：小标签图标、浏览器和操作系统要求的中间尺寸、移动主屏幕和Web应用清单使用的大图标，以及应用商店要求的全尺寸图片。您可以在预览网格中查看每个结果，只下载您实际需要的尺寸。

获得良好结果的最简单方法是从正方形图片开始。图标始终是正方形，工具会缩放您的源图以填满方形画布，因此非正方形图片会被拉伸。512x512或更大的透明PNG是最佳选择。如果您的Logo例如是1000像素宽但只有400像素高，请在上传前先裁剪成正方形，而不是让生成器去拉伸变形。

将大Logo缩放到16像素确实很难。文字消失，细线模糊在一起，精致的渐变变成噪点。生成器使用浏览器的高质量图像平滑功能，在每个尺寸下尽可能保持边缘干净，但当设计过于复杂时，每种工具都有其局限。对比强烈、简洁醒目的图案能经受住缩放到16像素的考验；复杂的艺术图则很少能幸免。

隐私是人们偏爱这种方法的主要原因之一。整个转换过程通过HTML5 canvas API在您的浏览器内完成。您的图片绝不会被上传、存储或发送到任何地方，这使得该工具非常适合未发布的产品、客户Logo以及任何您不想放在第三方服务器上的内容。完成后关闭标签页，您的上传痕迹便会消失。

也有必要明确这款工具不做的事。它输出PNG图标，这是几乎所有现代平台都接受的格式。它不会创建.ico文件，不会把所有内容打包成zip压缩包，也不会为您生成Web应用清单。实际上这很少成为问题：现代浏览器多年来一直愉快地使用PNG favicon，.ico格式大多是遗留物。下载您想要的尺寸，然后在您的页面中添加几个link标签。

将图标接入网站非常简单。在页面头部添加一个指向您主favicon的link标签，例如32x32的PNG，再加上一个供iOS使用的apple-touch-icon链接，如果您运行渐进式Web应用，还要在manifest.json文件中添加192x192和512x512条目。将文件上传到您的服务器，将标签指向它们，图标就会出现在标签页、书签和主屏幕中。

想想这经常出现的日常场景。博主想为WordPress准备一个合适的网站图标，又不想打开Photoshop。开发人员正在发布一个Web应用，需要在项目文件夹中准备favicon和PWA图标。初创公司正在准备App Store上架，需要一个既可作小启动器又可用的1024x1024方形图标。学生正在制作课程项目，希望它看起来完整。所有这些人都可以在不到一分钟内使用同一个工具。

在这里，设计选择比工具本身更重要。让favicon尽量接近您Logo的最简形式，使用品牌颜色，避免只在较大尺寸下才有意义的文字。如果您的图标有透明背景，请记住浏览器标签页有浅色和深色两种主题，所以要针对两种主题进行测试。如果它有纯色背景，那么无需额外努力，它在任何地方都会看起来一致。

还有一个实用提示：浏览器会积极缓存favicon。更新网站图标后，您可能会在一段时间内继续看到旧图标。硬刷新或在无痕窗口中快速检查即可确认新图标已生效。保持文件较小也有帮助，因为favicon在每次页面加载时都会被请求，而且往往是首批获取的文件之一。

使用它不需要设计经验，也不需要安装任何软件。它完全在您的浏览器中运行，适用于Windows、macOS、Linux，甚至在手机上也能用，无需创建账户，无需付费。您可以随时上传任意数量的图片，并只下载您需要的尺寸。它是那种能悄悄帮您省去一项出人意料繁琐任务的小工具。