Favicon 產生器

您將獲得的內容

favicon.ico（單一檔案包含 16、32 與 48）、favicon-16/32/48.png、apple-touch-icon.png（180，iOS 主畫面）、icon-192.png 與 icon-512.png（Android 與 PWA）、site.webmanifest，以及置於 head 的標籤代碼。全部打包在一個 ZIP 檔中。

最佳來源圖片

512px 或以上的正方形 PNG 或 SVG 檔。寬版文字標誌置中時兩側會留白，因此獨立的圖示符號在 16px 下的辨識度遠高於文字；在該尺寸下文字往往難以辨認。

背景與圓角

透明背景在分頁標籤與書籤中看起來很自然，但 iOS 可能會將主畫面圖示的透明區域填入純色（通常為黑色），因此在該處設定背景色會更安全。iOS 會自動處理圓角，因此 apple-touch-icon 通常保持正方形。iOS、Android 與 Windows 分別為 Apple、Google 及 Microsoft 的商標；Keepdesk 與其無附屬、贊助或背書關係。

安裝方式

將檔案放置於網站根目錄（/），並將 snippet.html 中的代碼貼入。若因快取導致舊圖示未更新，請在 URL 後方加上 ?v=2。

情境使用指南

數秒內產生完整的 PWA 圖示資源與 site.webmanifest將單一標誌轉換為 192/512 PWA 圖示、apple-touch-icon、favicon.ico 等…製作 iOS Apple Touch 圖示與多解析度網站圖示產生 apple-touch-icon.png (180px)、16/32/48 ICO 以及 manifest 檔…

使用此工具的文章

所有文章 →

黑客松 & Demo Day 準備：使用單一 PNG 標誌產生完整 Favicon 套件了解如何在專案發表前，從單一標誌圖片為桌面和行動瀏覽器產生完整的網站圖示套件。為新 Shopify 商店建立完整的 Favicon 組合：尺寸、格式與上傳說明從單張圖片為您的 Shopify 商店產生所有需要的 Favicon 尺寸與格式，並了解確切的上傳位置。

常見問題

圖片會被上傳嗎？

不會。調整尺寸、打包 ICO 以及壓縮為 ZIP 全都在您的瀏覽器中進行。

支援 SVG 嗎？

只要瀏覽器能繪製的 SVG 皆可。若 SVG 參照了外部字型或圖片，這些部分可能會遺失。

在舊版 Windows 上未顯示 ICO

PNG-in-ICO 是現代瀏覽器與較新的 Windows 支援的格式，但非常舊的環境可能僅能讀取以 BMP 為基礎的 ICO。針對這些環境，請一併保留 favicon-32.png。

下載內容具體包含哪些檔案？

您將獲得一個 ZIP 壓縮檔，內含多種尺寸的 favicon.ico、多種 PNG 圖示、web manifest 資訊清單以及必要的 HTML link 代碼片段。

我可以將圖示邊緣設為圓角嗎？

可以，您可以為圖示選擇正方形、圓角或圓形外觀。

此工具會自動去除圖片背景嗎？

不會，本工具不具備去背功能。若需要透明背景來源，請先使用去背工具處理。

可以在圖片周圍增加內距嗎？

可以，您可以套用 0%、8% 或 15% 的內距，以確保圖示邊緣不會被裁切。