SVG 轉 ICO 轉換器
用 SVG 製作 favicon 是最理想的做法:每種圖示尺寸都直接由向量重新繪製,而不是從大張點陣圖縮小,所以 16 px 版本也能在像素格線允許的範圍內保持清晰。
圖片轉換器
或將JPG, JPEG, JPE … 檔案拖曳到這裡 ·
每個檔案最大 95 MB· 最多 20 個檔案· 30 分鐘後刪除
檔案會在我們的伺服器上處理,並於 30 分鐘後刪除。
85 可讓照片在視覺上與原圖幾乎相同。只有需要更小的檔案時才調低。
JPG、BMP 和 EPS 不支援透明。透明的像素會以此顏色填滿。
用於透明像素後方的十六進位色碼,例如 #FFFFFF。
此格式只能存放單張圖片。若要保留動畫,請選擇輸出 GIF 或 WebP。
多尺寸圖示會在一個檔案中包含多種解析度,瀏覽器和作業系統會自行選用需要的尺寸。
保留原始尺寸,或輸入其中一邊,系統會維持長寬比。
上方所選邊的像素值。
相對於原始尺寸的百分比。
sRGB 適合螢幕和網頁。印刷流程請保留原始設定;灰階會捨棄顏色。
僅為中繼資料,0 表示保留原始值。印表機和部分入口網站會讀取此數值;不會改變像素尺寸。
使用方式
- 1
上傳 SVG Logo
請使用標誌或字母組合圖案,不要用完整的文字商標。正方形的 viewBox 轉出來的效果最乾淨。
- 2
保留所有圖示尺寸
圖示尺寸預設為「全部尺寸(16–256)」,會把所有解析度打包進同一個 .ico。只有在程式明確要求單一尺寸時,才需要選擇單一尺寸。
- 3
按下「轉換為 ICO」
將檔案儲存為 favicon.ico,放在網站的根目錄,或讓 Windows 捷徑指向它。
如何把 SVG 轉成 ICO 做為 favicon?
上傳 SVG,將圖示尺寸保持為「全部尺寸(16–256)」,然後按下轉換為 ICO。你會得到一個 .ico 檔案,內含從向量繪製出的所有解析度,並保留透明度。
SVG 轉 ICO 轉換器:為什麼向量是最佳來源
.ico 格式源自早期的 Windows 版本,而 favicon.ico 的慣例則始於 1999 年的 Internet Explorer 5,它會在你加入書籤的每個網站根目錄尋找這個檔名的檔案。ICO 是一種小型容器:內有一份目錄,每個項目都是獨立的正方形點陣圖,因此一個檔案可以同時存放 16 px 的分頁圖示和 256 px 的桌面圖示。Windows Vista 把上限提高到 256 × 256,並允許這些大尺寸項目以 PNG 儲存。
由於每個項目都是獨立的點陣圖,圖示的品質取決於各尺寸的產生方式。從 PNG 轉換時,每個尺寸都是同一批像素縮小而來;從 SVG 轉換時,每個尺寸都是重新繪製路徑,並針對該格線計算消除鋸齒。在 16 × 16 px 時,標誌只有 256 個像素可用,這種差異清晰可見。
16 × 16 px
16 × 16
瀏覽器分頁、書籤與歷史記錄清單。
32 × 32 px
32 × 32
高像素密度螢幕的分頁、Windows 工作列捷徑。
64 × 64 px
64 × 64
縮放後的桌面檢視與已釘選的項目。
128 × 128 px
128 × 128
檔案管理員中的大型預覽。
256 × 256 px
256 × 256
ICO 中最大的項目;檔案總管的特大圖示。
SVG
可縮放向量圖形(SVG)
SVG 是 W3C 於 2001 年標準化、以 XML 為基礎的向量格式。它描述的是形狀、路徑和文字而非像素,因此任何尺寸都保持清晰,用於標誌和圖示時檔案通常非常小。它支援透明度、CSS 樣式、指令碼和動畫,所有瀏覽器都能原生顯示。SVG 不適合照片,複雜的插圖也可能繪製得很慢。Illustrator、Inkscape、Figma 和瀏覽器都能開啟與編輯。
- 壓縮方式
- –
- 透明度
- 支援
- 動畫
- 支援
- 推出年份
- 2001 · W3C
ICO
Windows 圖示
ICO 是 Microsoft 的圖示格式,用於 Windows 程式圖示和網站 favicon。單一 .ico 檔可包含多種尺寸的影像,例如 16×16、32×32、48×48 和 256×256 像素,讓系統挑選最合適的尺寸。每張影像可儲存為點陣圖或 PNG 資料,並支援完整的 Alpha 透明度。ICO 不適合用於照片或大型圖像。瀏覽器、Windows 和多數圖示編輯器都能讀取。
- 壓縮方式
- 無損
- 透明度
- 支援
- 動畫
- 不支援
- 推出年份
- Microsoft
人們把 SVG 轉成 ICO,是因為標誌原本是向量檔,但網站根目錄、Windows 捷徑或桌面應用程式仍然需要一個包含多種點陣圖尺寸的 .ico 檔案。
SVG 轉 ICO 之前,先準備好 SVG
| 建議 | 避免 |
|---|---|
將 viewBox 設為正方形,例如 0 0 512 512。 | 不要依賴在 32 px 以下就會消失的極細線條。 |
| 預留一點邊距,讓圖案不要碰到圖示邊緣。 | 不要保留寬幅的文字商標,否則會縮成一道細細的模糊痕跡。 |
| 將文字轉為外框,字型才不會改變。 | 不要在 SVG 內參照外部圖片或網頁字型。 |
| 使用符號或縮寫字母,不要用完整名稱。 | 除非你希望深色分頁上也有白底,否則不要在標誌後面加白色矩形。 |
SVG 轉 ICO:常見問題
為什麼要用 SVG 轉 ICO 轉換器,而不是從 PNG 開始?
PNG 必須針對每個圖示尺寸縮小,而縮小會讓邊緣變模糊。SVG 則是直接以 16、32、64、128 和 256 px 繪製,每個尺寸的邊緣都會貼合自己的像素格線,因此更銳利。
網站已有 SVG 圖示,瀏覽器還需要 favicon.ico 嗎?
Chrome 和 Firefox 會讀取以 link 標籤宣告的 SVG favicon,但許多瀏覽器、RSS 閱讀器和爬蟲預設仍會向網站根目錄要求 /favicon.ico。兩種都提供就能全部涵蓋。
如果 SVG 不是正方形會怎樣?
圖示的欄位是正方形,寬幅的標誌不是留下大片空白,就是顯得很小。請先把 viewBox 改成寬高相等,或是匯出 PNG 後,用裁切圖片工具裁出正方形版本。
ICO 會保留透明背景嗎?
可以。ICO 支援 Alpha 色版,SVG 中沒有填色的區域會保持透明,圖示在淺色與深色的瀏覽器分頁上都能乾淨呈現。
可以把 SVG 轉成 ICO 當作 Windows 程式或資料夾圖示嗎?
可以,同一個檔案就能使用。Windows 在檔案總管的大圖示與特大圖示檢視會讀取 256 px 的影像,清單與工作列則使用較小的項目。
為什麼圖示在 16 px 時看起來空空的?
細線和小字在這個尺寸下會消失。在 512 單位的畫板中,2 單位的線條放進 16 px 的圖示,寬度遠小於一個像素。請加粗線條,或改用較簡單的圖案作為 favicon。
其他圖示轉換工具
- PNG 轉 ICO 轉換器線上將 PNG 轉 ICO:一個 .ico 檔案包含 16 到 256 px 的所有尺寸,保留透明背景。適用網站圖示(favicon)與 Windows 捷徑。免費、免註冊。
- JPG 轉 ICO 轉換器將 JPG 或 JPEG 轉成內含 16、32、64、128 和 256 px 尺寸的 .ico 檔,可用於網站 favicon 或 Windows 捷徑。免註冊。
- ICO 轉 PNG 轉換器將 .ico 檔轉換為 PNG 並保留透明背景。自動擷取圖示中最大的影像,讓網站圖示(favicon)與 Windows 圖示都清晰銳利。
- SVG 轉 PNG 轉換器將 SVG 標誌與圖示轉成 PNG,寬度自選(預設 1024 px),保留透明背景。並說明 DPI 與像素的關係。
- PNG 轉 ICO 256x256 轉換器將 PNG 製作成 256 × 256 ICO,適用 Windows 超大圖示、應用程式安裝檔與 Electron 建置。保留透明背景,每個檔案一種尺寸,免註冊。
- 圖片轉 ICO 轉換器把任何圖片轉成多尺寸 .ico,用於網站 favicon 或 Windows 捷徑。支援 PNG、JPG、SVG、WebP、HEIC 等格式,一個檔案內含 16 到 256 px。