window.addEventListener(‘message’, function (event) {
if (!event.data || event.data.type !== ‘resize’) return;
const iframe = document.getElementById(‘lovable-frame’);
if (iframe && typeof event.data.height === “number”) {
iframe.style.height = event.data.height + “px”;
}
});
为什么将 PNG 转换为 ICO？
ICO（图标）文件是创建 网站 favicon、Windows 桌面图标 和 应用程序图标 所必需的。虽然 PNG 适合透明度和质量，但大多数浏览器和系统仍需要 ICO 格式来显示小规模图标。
将 PNG 转换为 ICO 可以确保您的图标与所有主要浏览器、Windows 系统和应用程序启动器兼容，同时保持视觉质量和透明度。
使用 ICO 格式的主要优点
-
✅ favicon 准备就绪 – 可以轻松地将图标添加到您的网站选项卡、书签或 PWA 清单中。
-
✅ 支持多种分辨率 – ICO 文件可以包含各种尺寸（16×16、32×32、64×64 等）以实现响应式缩放。
-
✅ 适合 Windows 图标 – 与桌面快捷方式和 EXE 文件图标完全兼容。
如何使用此工具
-
上传您的 PNG 文件
点击“选择 PNG 文件”或将图像拖放到上面的上传框中。 -
自动转换
该工具将您的 PNG 图像转换为 ICO 格式，同时保持透明度。 -
下载 ICO
点击 下载 ICO 按钮以保存您的新图标文件。 -
在任何地方使用它
将您的 ICO 添加到您的网站作为 favicon，或在您的桌面或软件应用程序中使用它。
常见问题
ICO 文件是否支持透明度？
是的。此转换器保留 PNG 透明度在 ICO 输出中，使其适合干净、专业的图标。
我可以使用此 ICO 作为网站 favicon 吗？
绝对可以。只需将 ICO 上传到您的根目录，并在您的网站的 <head> 中使用 <link rel="icon" href="/favicon.ico"> 链接它。
此工具是否免费和安全？
是的。它是 100% 免费的、基于浏览器的，并且安全 —— 没有文件被存储，也无需安装。
我可以将其转换为其他图像格式吗？
是的，选择以下文件格式。
.conversion-footer {
font-family: system-ui, sans-serif;
margin: 30px 0;
}
details.convert-dropdown {
margin-bottom: 8px;
border: 1px solid #e0e0e0;
border-radius: 6px;
background-color: #fff;
transition: box-shadow 0.3s;
}
details.convert-dropdown[open] {
box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}
.convert-dropdown summary {
font-weight: 600;
font-size: 15px;
padding: 12px 16px;
background-color: #f7f8f9;
border-bottom: 1px solid #e0e0e0;
cursor: pointer;
list-style: none;
position: relative;
}
.convert-dropdown summary:hover {
background-color: #eef0f2;
}
.convert-dropdown summary::marker {
display: none;
}
.convert-dropdown summary::after {
content: “▾”;
position: absolute;
right: 16px;
font-size: 12px;
transition: transform 0.3s ease;
}
details[open] summary::after {
transform: rotate(180deg);
}
.convert-dropdown a {
display: block;
padding: 10px 20px;
text-decoration: none;
color: #0073aa;
font-size: 14px;
border-top: 1px solid #f1f1f1;
transition: background 0.2s;
}
.convert-dropdown a:hover {
background-color: #f1f7fb;
color: #005177;
}
