F
Favicon.pub

Favicon 轉換器

上傳一張圖片,即可為您的網站生成所有尺寸的 favicon。

favicon.pub 幫助您在數秒內生成所有必需的 favicon 格式——包括 PNG、ICO、SVG、Apple Touch 圖標、Android 圖標、Safari 釘選分頁圖標以及 PWA manifest 檔。

點擊或拖拽圖片到此處

支援 PNG, JPG, SVG, WEBP

瀏覽器 favicon(16x16、32x32、48x48)
適用於 iPhone 和 iPad 的 Apple Touch 圖標
適用於 PWA 的 Android Chrome 圖標
SVG favicon 與 Safari 釘選分頁圖標
自動產生 site.webmanifest
PWA 就緒的 favicon 與 manifest
為漸進式 Web 應用產生圖標

一鍵生成

上傳圖片即可生成所有尺寸的 favicon,包括 ICO、PNG、SVG 等多種格式

全平台相容

支援所有瀏覽器和裝置,包括 iOS、Android、Windows 等平台的圖標需求

專業品質

自動最佳化圖片品質,生成符合各平台標準的高品質 favicon 檔案

Privacy / Security

  • Files processed in browser
  • No uploads stored
  • Automatic cleanup

Who is this for

  • Developers
  • Designers
  • Indie Hackers
  • SaaS founders

Use cases

  • Website favicon
  • PWA icon
  • Web App
  • Mobile App placeholder

什麼是Favicon?

Favicon (favorite icon的縮寫) 是一個在瀏覽器標籤頁、書籤和其他介面元素中顯示的小圖標。它幫助使用者在多個開啟的標籤頁和書籤中快速識別您的網站。

Favicon 轉換器

favicon.pub 幫助您在數秒內生成所有必需的 favicon 格式——包括 PNG、ICO、SVG、Apple Touch 圖標、Android 圖標、Safari 釘選分頁圖標以及 PWA manifest 檔。

Favicon 轉換器

  • 瀏覽器 favicon(16x16、32x32、48x48)
  • 適用於 iPhone 和 iPad 的 Apple Touch 圖標
  • 適用於 PWA 的 Android Chrome 圖標
  • SVG favicon 與 Safari 釘選分頁圖標
  • 自動產生 site.webmanifest
  • PWA 就緒的 favicon 與 manifest
  • 為漸進式 Web 應用產生圖標

如何線上產生 Favicon 圖標

使用我們的 favicon 產生器非常簡單:

  1. 上傳 PNG、JPG 或 SVG 格式的 Logo 圖片。
  2. 即時預覽所有自動產生的 favicon 圖標。
  3. 下載 favicon 壓縮包,並將檔案加入到您的網站中。

如何將 Favicon 新增到您的網站

產生 favicon 檔案後,請在網站的<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 格式說明

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)

現代向量格式,可無限縮放不失真,支援深色模式,檔案體積小,是未來的趨勢。