PNG转ICO:创建干净的favicon.ico

PNG是创建网站图标最受欢迎的起点,这是有充分理由的。PNG文件支持透明度,干净地处理锐边,并且是几乎每个设计工具的原生导出格式。问题在于浏览器和操作系统不直接接受PNG作为favicon.ico文件。ICO格式是一个特殊的容器,可以在单个文件中保存多个图像尺寸,让系统自动为每个场景选择最佳分辨率。

使用Any2ICO,将PNG转换为多尺寸ICO只需不到一分钟。您上传图像、选择所需的尺寸、选择图像应如何缩放以及使用什么背景,然后下载完成的ICO。整个转换在您的浏览器中使用Canvas API运行,因此您的文件保留在您的设备上,永远不会上传到远程服务器。

本指南将引导您完成该过程的每个步骤。您将了解网站图标与Windows桌面图标要包含哪些尺寸、何时使用包含与覆盖缩放,以及如何处理背景颜色。最后,您将拥有一个专业的多尺寸ICO文件,可以随时放入您的网站或应用程序。

分步操作:将PNG转换为ICO

按照以下四个步骤将任何PNG转换为干净的多尺寸ICO文件。

步骤1——上传您的PNG

在任何现代浏览器中打开Any2ICO转换器。将PNG文件拖到上传区域,或点击从设备浏览。您还可以从剪贴板粘贴图像、输入URL或从Google Drive或OneDrive导入。Any2ICO接受最大10 MB的PNG文件。

步骤2——选择图标尺寸

选择要嵌入ICO文件中的像素尺寸。Any2ICO提供16、32、48、64、128和256像素。对于标准网站图标,至少选择16、32和48。如果图标也将用作Windows快捷方式或应用程序图标,还要添加64、128和256。您可以选择全部六个以获得最大兼容性。

步骤3——选择缩放和背景

在缩放下,选择包含以将整个图像适配到图标框架内(最适合标志和插图)或覆盖以完全填充框架,必要时裁剪边缘(最适合照片和全出血图形)。然后将背景设置为透明(如果您的PNG具有Alpha通道)或白色(如果您更喜欢实心背景)。

步骤4——转换并下载

点击转换。Any2ICO会立即在您的浏览器中生成ICO文件。下载单个.ico文件并将其作为favicon.ico放在网站的根目录中,或在操作系统期望图标文件的任何地方使用它。如果您转换了多张图片,Any2ICO会自动将它们捆绑到ZIP压缩包中。

应该包含哪些尺寸?

ICO格式可以在单个文件中保存多个分辨率,每个分辨率都有不同的用途。选择正确的组合可确保您的图标在出现的任何地方都看起来清晰。

16x16是经典的网站图标尺寸。浏览器在标签页、书签栏和历史列表中显示它。这是您应该包含的绝对最小值。

32x32由浏览器在高DPI(Retina)显示器上使用,并由Windows用于小快捷方式图标。在16x16旁边包含它可以防止浏览器在清晰屏幕上放大16像素版本。

48x48出现在Windows任务栏和某些需要稍大图标的浏览器场景中。它完善了Web使用的基本三元组。

64x64、128x128和256x256主要与Windows桌面快捷方式、应用程序图标和高分辨率显示器相关。如果您的ICO仅用作网站图标,您可以跳过这些以保持文件小。如果图标可能在桌面上使用,请包含它们以获得最佳外观。

有关每个尺寸在哪里显示的更深入的分解,请参阅我们的网站图标尺寸指南。

缩放:包含与覆盖

当您的源PNG不是完美的正方形,或者它与目标图标尺寸不完全匹配时,Any2ICO需要一个规则来将图像适配到方形图标框架中。该规则是缩放模式。

包含将图像缩小,直到它完全适合图标框架内。如果源不是正方形,您将在两侧看到填充。此模式保证不会裁剪任何内容。这是标志、文字标记和任何裁剪边缘不可接受的图形的最佳选择。

覆盖将图像放大或缩小,直到它完全填充图标框架。如果源不是正方形,溢出的边缘会被裁剪。此模式用于您想要没有填充和没有空白空间的照片、纹理或全出血背景。

在大多数网站图标工作流程中,包含是正确的默认设置。图标很小,即使从标志中裁剪几个像素也会使其无法识别。保留覆盖用于图像已经是正方形或填充整个框架比保留每个边缘更重要的特殊情况。

背景:透明与白色

背景设置控制当图标框架未完全覆盖时图像后面出现的内容——要么是因为源具有Alpha通道(透明度),要么是因为包含缩放添加了填充。

透明保持Alpha通道完整。图标与它所在的任何表面无缝融合,无论是深色浏览器标签页栏、浅色书签列表还是彩色桌面壁纸。这是标志和符号的标准选择。

白色用纯白色填充任何非图像区域。当您的源PNG在白色画布上设计且透明度会暴露不需要的边缘时,或者当图标将出现在不能很好地支持透明度的场景中时,这很有用。

根据经验:如果您的PNG已经具有透明背景并且在小尺寸下看起来不错,请将背景设置为透明。如果设计依赖于白色环绕或您在边缘周围看到视觉伪影,请切换到白色。