Favicon 轉換

把圖片轉換成網站圖示格式

檔案不會離開你的裝置
在瀏覽器本機執行
免費、免註冊、無浮水印

拖放 Logo 或圖片到這裡，或點擊選擇

使用至少 512 × 512 px 的方形圖片效果最清晰，SVG 最理想。

如何使用Favicon 轉換

把 Logo 或圖片轉成整套網站圖示：favicon.ico、各尺寸 PNG、Apple 與 Android 圖示、資訊清單和 HTML 標籤。全部在瀏覽器中產生，SVG 來源還會輸出清晰的 favicon.svg。

把 Logo 或圖片拖曳到頁面上、點擊選擇，或按 Ctrl+V 貼上，支援 PNG、JPG、SVG、WebP、GIF、AVIF、ICO、HEIC。

在「適配方式」選擇「完整顯示」或「裁切為方形」；Logo 周圍有透明留白時，開啟「裁掉空白邊緣」。

在「圖示樣式」設定背景（無、純色、漸層）、形狀和內距，同時查看瀏覽器分頁與主畫面預覽。

填寫「網站資訊」（網站名稱、短名稱、主題色、圖示所在路徑），並在「輸出」勾選需要的尺寸。

點擊「下載圖示包（ZIP）」，把檔案上傳到網站，再把「貼到 <head> 中」的標籤複製到網頁裡。

常見問題

Logo 會上傳到伺服器嗎？

不會。所有圖示都在瀏覽器中以 canvas 繪製，圖片不會離開你的裝置。

圖示包裡有哪些檔案？

favicon.ico（預設含 16、32、48 px，最大可選 256 px）、favicon-16x16.png 與 favicon-32x32.png 以及你勾選的額外 PNG 尺寸、apple-touch-icon.png（180 px）、android-chrome 192 與 512 px、maskable-icon-512x512.png、site.webmanifest 和 favicon-snippet.html。也可以在「檔案」清單中單獨下載任一檔案。

來源圖片用什麼規格最好？

至少 512 × 512 px 的方形圖片。較小的圖片會被放大，頁面會提醒可能變模糊。SVG 最理想：任何尺寸都清晰，圖示包也會多出 favicon.svg。

Logo 不是正方形怎麼辦？

「完整顯示」會保留整個 Logo 並在四周留白；「裁切為方形」會填滿圖示，較長的兩側會被裁掉。

為什麼 Apple 觸控圖示是白底？

iOS 主畫面圖示不支援透明，所以 apple-touch-icon.png 和 maskable 圖示一律是不透明的方形。背景選「無」時會填入白色，maskable 圖示也會把圖案留在安全區內，避免被 Android 裁成圓形時切掉。

和「Favicon 產生器」有什麼不同？

轉換工具從你現有的圖片開始；產生器則用文字、Emoji 或開源圖示製作圖示，輸出的圖示包相同。