SVG Favicon

SVG favicon 是可缩放的矢量图标。任意尺寸都完美清晰，还支持深色模式变体——是现代浏览器最佳格式，搭配 PNG 给旧浏览器兜底。

用 <link rel="icon" type="image/svg+xml" href="/favicon.svg"> 添加 SVG favicon。SVG 无损缩放，支持基于媒体查询的深色模式变体。为旧浏览器提供 PNG/ICO 兜底。

SVG favicon 的 HTML（含 PNG 兜底）

<link rel="icon" href="/favicon.svg" type="image/svg+xml">
<link rel="icon" href="/favicon.ico" sizes="any">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">

常见问题

SVG favicon 比 PNG 好吗？+

对现代浏览器是的——SVG 任意尺寸都完美清晰，支持深色模式变体。给旧浏览器保留 PNG/ICO 兜底。

SVG favicon 怎么支持深色模式？+

在 SVG 里加 <style> 块，用 @media (prefers-color-scheme: dark) 切换颜色，浏览器会自动应用。

所有浏览器都支持 SVG favicon 吗？+

大多数现代浏览器支持（Chrome、Firefox、Safari、Edge）。旧浏览器和部分爬虫不支持，所以务必保留 PNG/ICO 兜底。

需要 SVG favicon？

上传 SVG（或任意图片），生成含 favicon.svg、ICO 和各 PNG 尺寸的完整 favicon 包。

打开 Favicon 生成器