Iconpie – 快速免費產生網站圖標 Icons，上傳圖片後自動產生 Web、iOS、Android 圖標

Iconpie 是一款免費的線上圖標產生工具，只要上傳一張圖片，就能自動幫你產生超過 50 種不同尺寸的圖標檔案，涵蓋 Web 網站 Favicon、iOS App Icons 和 Android App Icons 三大平台。對於需要同時維護多個平台的開發者來說，不用再手動一張張調整尺寸，幾分鐘就能搞定所有圖標需求。這篇文章會帶你從基礎觀念到實際操作，完整了解如何使用 Iconpie 並把產生的圖標安裝到你的 WordPress 網站。

工具名稱：Iconpie | All Your Icons Easy As Pie
官方網址：https://iconpie.com/

Iconpie 是什麼？免費線上圖標產生器完整介紹

做網站或開發 APP 的人一定遇過這個狀況：設計師給了一張漂亮的 LOGO，結果你要面對 Web、iOS、Android 三個平台，每個平台各自需要十幾種不同的圖標尺寸，光是用繪圖軟體一張張調整就花掉大半天。Iconpie 就是專門解決這個痛點的免費線上工具，只要上傳一張圖片，它就會自動幫你裁切並產生超過 50 種尺寸的圖標檔案。

官方標語寫得很直接：「All Your Icons Easy As Pie」，把所有圖標弄得像吃派一樣簡單。實際用過之後確實名符其實，整個操作流程從上傳到下載完成，不用三分鐘就能搞定。不需要註冊帳號，不用填 Email，開啟瀏覽器就能直接使用，這點對臨時需要產生圖標的人來說真的相當友善。

Iconpie 產出的圖標涵蓋三大類：Web Icons（包含 favicon.ico 和各種尺寸的 PNG）、Apple App Icons（從 57×57 到 180×180 的 iOS 圖標）、以及 Android App Icons（包含 mdpi 到 xxxhdpi 的全尺寸）。幾乎所有主流平台的圖標需求一次打包下載，不用再額外開其他工具處理。

如果你之前用過 SVG Favicon Maker 這類單一功能的 Favicon 製作工具，Iconpie 的定位不太一樣。它不是讓你「設計」圖標的網站，而是把你已經有的 LOGO 圖片快速轉換成各平台所需的規格。所以我通常會建議先用 Logaster 或 DesignEvo 把 LOGO 做好，再拿到 Iconpie 來批次產生所有圖標，這是最順暢的工作流程。

底下我會從 Favicon 的基礎知識講起，帶你搞懂各平台的圖標尺寸需求，然後一步一步教你用 Iconpie 產生圖標、安裝到 WordPress 網站，還有手動修改 HTML 程式碼的完整方法。

Favicon 是什麼？為什麼每個網站都需要 Favicon

Favicon 這個詞來自「Favorite Icon」，講白話一點就是瀏覽器分頁上那個小小的網站圖示。你在 Chrome 開了一堆分頁的時候，能快速找到想切回去的那個頁面，靠的就是 Favicon 的視覺辨識。沒有 Favicon 的網站會顯示一個預設的灰色地球圖示，在一排有圖標的分頁裡面特別顯眼，但不是好的那種顯眼。

Favicon 看起來只是個不起眼的小圖片，但它對使用者體驗的影響比你想像的大。想像一下你在做 SEO 搜尋引擎最佳化，好不容易把網站排上了首頁，結果在搜尋結果裡你的連結旁邊什麼圖都沒有，旁邊競爭對手的網站卻都有漂亮的 Favicon。哪個會吸引點擊？答案很明顯。Google 從 2019 年開始在桌面版搜尋結果頁面顯示 Favicon，這意味著它已經成為搜尋結果視覺呈現的一部分。

從品牌角度來看，Favicon 是你網站在瀏覽器裡的「迷你招牌」。一個設計良好的 Favicon 能讓使用者在眾多分頁中一眼認出你的網站，這種潛移默化的品牌印象累積，長期下來的效果不容小看。特別是對內容型網站來說，讀者常常同時開好幾篇文章在比較，有清晰 Favicon 的網站會讓人覺得更用心、更值得信賴。

行動裝置上 Favicon 的角色更重要。當使用者把手機瀏覽器裡的網站「加入主畫面」時，顯示在桌面上的圖示就是從你的 Favicon 相關設定抓取的。如果沒有正確設定 apple-touch-icon，iOS 會自動用網頁截圖來當作圖示，效果通常很醜。這時候你就需要像 On-page SEO 優化 所強調的那樣，把每個影響使用者體驗的細節都做到位。

還有一個容易被忽略的場景是書籤列。很多使用者習慣把常用網站釘選在書籤列上，這時候顯示的也是 Favicon。如果你的 Favicon 設計夠清楚、辨識度夠高，使用者不需要看文字就能快速點擊前往你的網站，這對回訪率有正面的幫助。

講到這裡你可能會問，Favicon 跟 Meta Tag 有什麼關係？其實它們都屬於 HTML head 區段的設定，都是在告訴瀏覽器「這個網站長什麼樣子、叫什麼名字」。把 Favicon、Meta Title、Meta Description 都設定好，你的網站在搜尋結果和使用者端看起來才會是一個完整的專業形象。

各平台圖標尺寸需求完整對照表

不同平台和裝置對圖標尺寸的要求差異很大，這也是為什麼手動用繪圖軟體處理會這麼耗時。底下這張表格整理了所有常見的圖標尺寸需求，讓你在使用 Iconpie 之前先有個整體概念。

Web Favicon 尺寸需求

網站用的 Favicon 看起來只是一個小圖示，但實際上瀏覽器在不同場景會呼叫不同尺寸。早期的 favicon.ico 檔案本身就是一個包含多種尺寸的容器格式，現代瀏覽器則傾向使用 PNG 格式搭配 sizes 屬性來指定。

iOS 與 Android 圖標尺寸

Apple 裝置從 iPhone 到 iPad 各有不同解析度，因此需要多種尺寸的 Touch Icon。Android 方面則有 ldpi 到 xxxhdpi 共六種密度等級，加上 Adaptive Icon 的需求，圖標數量更多。如果你打算做 結構化資料測試 設定，建議同時把圖標也一併處理好，這樣 PWA 安裝時才有完整的視覺體驗。

平台	用途	尺寸（px）	格式
Web	瀏覽器分頁 Favicon	16×16, 32×32, 48×48	.ico / .png
Web	Chrome 工作列捷徑	192×192, 512×512	.png
iOS	iPhone / iPod Touch	120×120	.png
iOS	iPad / iPad Pro	152×152, 167×167, 180×180	.png
iOS	Spotlight 搜尋結果	80×80, 87×87, 58×58	.png
Android	ldpi	36×36	.png
Android	mdpi	48×48	.png
Android	hdpi	72×72	.png
Android	xhdpi	96×96	.png
Android	xxhdpi	144×144	.png
Android	xxxhdpi	192×192	.png
PWA	manifest icon	192×192, 512×512	.png

從表格可以看出，如果你要手動產生每一種尺寸，至少要處理 15 到 20 個不同的檔案。這也是為什麼像 Iconpie 這樣的自動化工具這麼實用。而且產生之後如果你發現圖標檔案太大，可以搭配 Imagify 這類圖片壓縮工具來縮小檔案體積，特別是 WebP 格式 在現代瀏覽器上的支援度越來越好，能有效減少圖標對載入速度的影響。

一個常見的誤解是「我只做網站，不需要 APP 圖標」。但現在越來越多網站支援 PWA 功能，當使用者把手機瀏覽器裡的網站加到主畫面時，系統抓取的就是 Android 和 iOS 的圖標設定。所以就算你目前沒有開發 APP 的計畫，把這些尺寸都準備好也不會白費。搭配 ShortPixel 把圖標壓縮到最佳大小，也不會拖慢網站的載入速度。

Iconpie 使用教學：3 步驟產生全平台圖標

Iconpie 的操作介面非常直覺，基本上就是上傳、裁切、下載三個動作。底下我把每個步驟的細節都記錄下來，跟著做就能順利產生所有圖標。

步驟 1：準備你的 LOGO 圖片

在上傳之前，你需要先準備一張要當作圖標的圖片。有幾個重點要注意：

• 建議使用正方形圖片：圖標最終都是正方形的，如果你上傳長方形圖片，Iconpie 會讓你裁切成正方形
• 解析度至少 512×512 像素：因為最大的輸出尺寸是 512×512，原始圖片太小會導致放大後模糊
• PNG 透明背景效果最好：這樣產生的各尺寸圖標背景都是透明的，在各種底色上看起來都很乾淨
• 避免過多細節：Favicon 最小只有 16×16 像素，細節太多在縮小後會糊成一團

如果你還沒有 LOGO，可以用 DesignEvo 這個免費的線上 Logo 設計工具先做一個。它內建上萬個模板，選一個喜歡的微調顏色和文字就能下載。不想花時間的話，Free Typography Logo Maker 更快，輸入文字就能產生簡潔的文字 Logo。如果你偏好圖形化的 Logo，Instant Logo Design 和 Logo Instant 也都有免費素材可以下載。Brandbuilder 則適合需要建立完整品牌視覺的人，一次搞定 Logo、名片和社群媒體圖像。

步驟 2：上傳圖片到 Iconpie

準備好圖片之後，打開 Iconpie 官方網站（https://iconpie.com/）。頁面中間有一個很大的上傳區域，你可以直接把圖片拖曳進去，或者點擊區域後從檔案總管選擇圖片。

Iconpie 官方標示支援的格式有 PNG、JPG 和 GIF，不過實測上傳 SVG 檔案也行。上傳之後會進入裁切畫面，你可以調整要擷取的範圍。這裡有一個小技巧：盡量讓主體圖案佔滿整個裁切框，周圍不要留太多空白，這樣產生出來的小尺寸圖標才看得清楚。如果你的圖片背景比較複雜，可以先透過 Fotor 這類線上圖片編輯器把背景處理成透明。

調整好範圍之後，點選「Crop & Upload Image」按鈕。系統會自動開始處理，通常幾秒鐘就完成了。

步驟 3：下載產生的圖標檔案

處理完成後，頁面下方會顯示所有產生的圖標預覽。它們被分成三個區塊：

• Web Icons：包含 favicon.ico 和各種尺寸的 PNG 圖標，用於網站瀏覽器
• Apple App Icons：iOS 裝置所需的各種尺寸圖標
• Android App Icons：Android 各密度等級的圖標檔案

你可以根據需求分別下載，或者一次全部下載。點選「Download」按鈕會下載一個壓縮檔，解壓縮後會看到依照平台分類好的資料夾結構，每個資料夾裡面就是對應尺寸的圖標檔案。檔案命名也很清楚，通常包含尺寸資訊，例如 favicon-16x16.png、apple-touch-icon-180x180.png 這樣的格式，安裝的時候非常方便辨識。

整個流程從上傳到下載完成，真的只需要幾分鐘。比起開 Photoshop 一個一個調整尺寸再匯出，效率差了十倍以上。下載的壓縮檔如果想要再做格式轉換，可以用 AnyWebP 來把 PNG 轉成 WebP 或其他格式。

如何將 Iconpie 產生的圖標安裝到 WordPress 網站

用 Iconpie 產生圖標只是第一步，真正重要的是把這些圖標正確安裝到你的網站上。如果你是用 WordPress 架站（大多數人都是），有幾種不同的安裝方式可以選擇。如果你還沒有自己的 WordPress 網站，可以先參考 WordPress 是什麼的入門介紹，選擇一個像 Bluehost 或 Kinsta 這樣優質的主機來安裝 WordPress。不確定該選哪家的話，WordPress 虛擬主機推薦 這篇整理了各家的優缺點和費用比較。

方法一：使用 WordPress 內建的網站圖示功能

WordPress 從 4.3 版本開始就內建了「網站圖示」功能，這是最簡單的方式：

• 進入 WordPress 後台，前往「外觀 → 自訂」
• 找到「網站識別」區塊
• 點選「網站圖示」下方的「選取圖片」按鈕
• 上傳你從 Iconpie 下載的 512×512 尺寸 PNG 圖標
• WordPress 會自動幫你裁切成各種需要的尺寸

這個方法的好處是 WordPress 會自動處理大部分的事情，包含產生 favicon 和 apple-touch-icon。不過它產生的尺寸種類可能沒有 Iconpie 那麼完整，特別是 Android 相關的圖標可能會缺少。如果你追求最完整的跨平台支援，建議用下面的手動方式補齊。

方法二：手動上傳圖標檔案

如果你想安裝 Iconpie 產生的所有圖標，手動上傳是最完整的做法：

• 透過 FTP 或主機控制面板的檔案管理員，連線到你的網站伺服器
• 把 favicon.ico 上傳到網站的根目錄（通常是 public_html/）
• 在根目錄下建立一個 icons/ 資料夾，把其他 PNG 圖標放進去
• 在佈景主題的 header.php 或透過 functions.php 加入對應的 HTML link 標籤

如果你是用 A2 Hosting 或 SiteGround 這類主機，它們的控制面板都有圖形化的檔案管理員，上傳檔案很方便。如果你是進階使用者，也可以搭配 Filester 這個 WordPress 檔案管理外掛，直接在後台操作伺服器上的檔案，不用額外開 FTP 軟體。

方法三：使用 WordPress 外掛管理圖標

如果你不想動到佈景主題的程式碼，也可以安裝專門管理 Favicon 的 WordPress 外掛。這類外掛通常提供一個上傳介面，讓你分別設定 Web Favicon、Apple Touch Icon、Android 圖標等，而且不用修改任何檔案。缺點是會多裝一個外掛，對於講究 WordPress 網站速度最佳化 的人來說可能不太想為了 Favicon 多裝一個。如果你很在意網站效能，建議搭配 WordPress 快取外掛 一起使用，確保新增的圖標靜態檔案不會拖慢頁面載入。

安裝圖標之後，記得用 GiftofSpeed 這類 網站速度測試 工具確認靜態資源的載入狀況。如果發現圖標檔案拖慢了載入速度，可以考慮啟用 GZIP 壓縮 或者搭配 CDN 服務來加速。經營 WordPress 網站需要兼顧很多面向，不過 Favicon 這種設定一次就好的事情，花個十分鐘處理完就一勞永逸了。

手動安裝 Favicon 的 HTML 程式碼教學

不管你是用 WordPress、自行開發網站，還是用靜態網頁產生器，Favicon 的安裝原理都一樣：在 HTML 的 <head> 區段中加入對應的 <link> 標籤。這一節我把完整的程式碼範例列出來，你可以直接複製後根據自己的需求修改路徑。

每個 <link> 標籤有幾個關鍵屬性要搞清楚：rel 指定圖標類型（icon、apple-touch-icon 等），type 指定檔案格式，sizes 指定圖標尺寸，href 指定檔案路徑。這些屬性和 Meta Tag 設定一樣都放在 head 區段，影響的是瀏覽器和搜尋引擎對你網站的解讀方式。

Web Favicon 宣告

最基本的 Favicon 設定只需要幾行：

<link rel="icon" type="image/png" sizes="32x32" href="/icons/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/icons/favicon-16x16.png">
<link rel="icon" type="image/x-icon" href="/favicon.ico">

瀏覽器會從最小的尺寸開始找，所以 16×16 一定要有。如果你有 favicon.ico 放在根目錄，就算不寫宣告，大部分瀏覽器也會自動去抓，但建議還是明確寫上比較保險。

Apple Touch Icon 宣告

iOS 裝置需要 apple-touch-icon 設定，否則把網站加到主畫面時會用難看的截圖當圖示：

<link rel="apple-touch-icon" sizes="180x180" href="/icons/apple-touch-icon-180x180.png">
<link rel="apple-touch-icon" sizes="152x152" href="/icons/apple-touch-icon-152x152.png">
<link rel="apple-touch-icon" sizes="120x120" href="/icons/apple-touch-icon-120x120.png">

Android 與 PWA 的 manifest.json 設定

Android 裝置和 PWA 漸進式網頁應用的圖標設定是透過 manifest.json 這個檔案來完成的。在 HTML head 中加入：

<link rel="manifest" href="/icons/manifest.json">

然後 manifest.json 的內容大致如下：

{
  "name": "你的網站名稱",
  "icons": [
    { "src": "/icons/android-chrome-192x192.png", "sizes": "192x192", "type": "image/png" },
    { "src": "/icons/android-chrome-512x512.png", "sizes": "512x512", "type": "image/png" }
  ],
  "theme_color": "#ffffff",
  "background_color": "#ffffff",
  "display": "standalone"
}

如果你有搭配 Google Fonts 網頁字型 或 Cloudflare CDN 等服務，這些靜態資源的載入設定也都可以跟 Favicon 設定一起放在 head 區段中，一次把所有外部資源的引用都搞定。如果你想知道自己的 TTFB 等待時間 是否正常，這些靜態資源的數量和大小都會直接影響伺服器的回應速度。

Iconpie 與其他圖標產生工具的詳細比較

Iconpie 並不是市面上唯一的圖標產生工具，但它的特色在於極度簡化的操作流程。市面上還有幾個知名的替代方案，各有強項。底下我用一個表格快速比較，然後針對每個工具做補充說明。

工具名稱	操作難度	輸出格式	特色功能	免費程度
Iconpie	非常簡單	ICO、PNG	一鍵產生全平台圖標	完全免費
RealFaviconGenerator	中等	ICO、PNG、SVG	可微調各平台設定、產生完整程式碼	免費（部分進階功能付費）
Favicon.io	簡單	ICO、PNG	可從文字、圖片、Emoji 產生	完全免費
SVG Favicon Maker	簡單	SVG	專注 SVG 格式、可加 Emoji	完全免費

RealFaviconGenerator：功能最全面的選擇

RealFaviconGenerator 是老牌的圖標產生器，歷史比 Iconpie 久得多。它的強項是讓你可以針對每個平台分別微調設定，例如 iOS 圖標要不要加上圓角、Android 圖標的背景色要什麼、Windows 磁貼的設定等等。產生的同時還會附上完整的 HTML 程式碼和 manifest.json，讓你直接複製貼上就能用。缺點是介面比較密集，選項很多，初次使用可能需要花點時間搞懂每個設定在幹嘛。如果你的圖標需求比較單純，Iconpie 會比較適合你。

Favicon.io：從文字和 Emoji 就能產生

Favicon.io 最大的特色是可以直接用文字或 Emoji 來產生 Favicon，不一定需要上傳圖片。這對於個人部落格或小型專案來說很方便，隨手打一個字母就能產生看起來還不錯的 Favicon。不過它產出的圖標種類沒有 Iconpie 那麼多，主要集中在 Web Favicon 部分。

SVG Favicon Maker：向量格式的選擇

如果你注重圖標在任何解析度下都保持清晰，SVG Favicon Maker 是值得考慮的選項。SVG 是向量格式，不管放大縮小都不會模糊，在支援 SVG Favicon 的瀏覽器上效果很好。不過 SVG 格式在 iOS 和 Android 上不被直接支援，所以你還是需要 PNG 格式的圖標來搭配。

我的建議是這樣：如果你只是需要快速把一張 LOGO 轉成各平台圖標，Iconpie 最省事。如果你需要更精細的控制和完整的程式碼輸出，選 RealFaviconGenerator。如果你想從零開始用文字產生 Favicon，Favicon.io 比較方便。而如果你手邊已經有很多圖標素材需要整理和搜尋，Flaticon 和 FindIcons 這類圖標庫會更實用。想把圖標做成自訂字型檔的話，IcoMoon App 則是不二之選。你也可以參考 Iconstore 的高畫質圖標集合包，或者到 Iconshock 找超過 200 萬個圖標。

Favicon 對 SEO 和品牌形象的實際影響

很多人覺得 Favicon 就是個裝飾品，對 SEO 沒什麼實際幫助。嚴格來說，Google 官方確實沒有把 Favicon 列為直接的排名因素。但如果因此就忽略它，那可就虧大了。

先講搜尋結果頁面。Google 從 2019 年開始在桌面搜尋結果中顯示網站的 Favicon，這代表使用者在決定要不要點擊你的連結時，Favicon 是他們視覺接收到的第一個品牌元素。一個有清晰 Favicon 的搜尋結果，跟一個什麼都沒有的空白結果擺在一起，點擊率會有差距。雖然差距可能不大，但在競爭激烈的關鍵字戰場上，每一個百分比的點擊率提升都很珍貴。

再來是品牌一致性。當使用者在瀏覽器分頁、書籤列、手機主畫面、搜尋結果頁面上都看到同一個圖示，對你品牌的記憶會更加深刻。這跟 網站載入速度 的邏輯有點像：單一因素的效果不明顯，但所有小細節加在一起，就會影響使用者對你網站的整體印象和信任度。

行動裝置上的影響更加直接。當使用者把你的網站加到 iOS 或 Android 的主畫面時，顯示的圖示就是從你設定的 apple-touch-icon 和 manifest icon 抓取的。如果你的 PWA 網站連個像樣的圖示都沒有，使用者會懷疑這是不是一個不夠成熟的產品。你可以用 Compress PNG/JPG 工具確認圖標檔案不會太大，再透過 SG Optimizer 這類外掛處理靜態資源的快取設定。定期用 WP Umbrella 監測網站運行狀態也是好習慣，確保所有靜態資源（包含圖標）都能正常載入。

到頭來，Favicon 的價值不在於直接拉升排名，而是透過提升使用者體驗和品牌形象，間接帶動點擊率、停留時間和回訪率。這些指標都是 Google 在衡量網站品質時會參考的訊號。所以與其問「Favicon 對 SEO 有沒有幫助」，不如問「你的網站值不值得花五分鐘設定一個 Favicon」。

免費圖標素材與設計資源推薦清單

要用 Iconpie 產生圖標，前提是你得先有一張好看的 LOGO 或圖標素材。如果你沒有設計背景，也不用擔心，底下這些免費資源可以幫你從零開始打造專業的圖標。

免費圖標下載網站

如果你需要的是 UI 圖標（按鈕、選單、社交媒體圖示等），這些網站都有大量免費素材：

• Icons8：提供大量圖標、插圖和照片，圖標種類非常豐富
• Flaticon：全球最大的免費圖標庫，數量驚人，需標註來源即可免費使用
• iconmonstr：4496 個 CC0 授權的免費圖標，不需署名就能商用
• Heroicons：開源免費的 SVG 圖標，設計簡潔適合現代化介面
• Feather Icons：超過 200 個系統常用圖示，線條乾淨俐落
• LineIcons：2000+ 個線形圖標，專為設計師和開發者設計
• Remix Icon：2000+ 個開源圖標，無版權限制可商用
• Octicons：GitHub 官方開源圖標，技術感十足
• Ionicons：1200+ 個免費圖標，專為 Web、iOS、Android 跨平台設計
• IconPark：字節跳動官方出品，1287+ 個高品質圖標可線上客製化
• Iconhub：6 種不同樣式、上千種圖標，可做商業用途
• Animated Icons by Icons8：如果你需要動畫圖標，這裡有 900+ 個免費動態圖示
• Emblemicons：1000+ 個產品開發和業務展示用的圖標樣式

免費 Logo 設計工具

如果你需要的是完整的品牌 LOGO 而不是單個 UI 圖標，這些工具可以幫上忙：

• DesignEvo：內建 10,000+ 模板的免費線上 Logo 設計工具
• Logaster：一秒建立 Logo 與 Favicon 的線上產生器
• Brandbuilder：線上品牌 Logo 設計工具，適合建立完整品牌識別

圖片處理與格式轉換工具

有了圖標素材之後，你可能還需要做一些格式轉換或壓縮：

• AnyWebP：免費線上 WebP 轉 JPG/PNG/ICO 格式轉換工具
• ShortPixel：免費線上圖片壓縮，壓縮率高且不失真，還提供 WordPress 外掛
• Fotor：跨平台免費線上圖片編輯器，可以做簡單的圖標調整
• DesignCap：免費線上圖片編輯器，大量範本一鍵套用

選擇圖標風格的時候，建議考慮你的網站或 APP 的整體視覺調性。扁平化風格適合科技類網站，線性風格看起來更輕盈簡潔，雙色調則適合想要更有設計感的場景。不管選哪種風格，最重要的是保持一致性，從 Favicon 到網站內的 UI 圖標，再到 APP 圖標，都應該使用同一套設計語言。如果你在做 WordPress 佈景主題挑選 的時候，也可以把主題內建的圖標風格列入考量。

Iconpie 常見問題 FAQ

Iconpie 是否完全免費？

是的，Iconpie 目前所有功能完全免費，也沒有每日使用次數的限制。不需要註冊帳號或提供 Email，打開網頁就能直接使用。不過這類免費工具的永續性取決於開發者的維護意願，如果未來有收費計畫也很正常。

Iconpie 支援哪些圖片格式上傳？

官方標示支援 PNG、JPG 和 GIF 三種格式。不過實測上傳 SVG 檔案也可以成功處理，這對於使用向量圖 LOGO 的人來說是個好消息。建議優先使用 PNG 格式搭配透明背景，這樣產出的圖標在各種底色上都能正常顯示。

Iconpie 產生的圖標可以用於商業用途嗎？

Iconpie 產生的圖標是根據你上傳的原始圖片來裁切和縮放的，所以授權問題取決於你使用的原始圖片。如果你用自己設計的 LOGO 或購買了商用授權的素材，那產出的圖標當然可以商用。如果原始圖片本身有版權限制，產出的圖標也一樣受限。

Iconpie 和 RealFaviconGenerator 哪個比較好？

這取決於你的需求。如果你只是想快速把一張圖片轉成各平台圖標，Iconpie 的操作更簡單直覺，上傳到下載只需要幾分鐘。如果你需要更精細的控制，例如調整 iOS 圖標的圓角、設定 Windows 磁貼的背景色、或者想要產生完整的 HTML 程式碼和 manifest.json，RealFaviconGenerator 會更適合。兩個工具都是免費的，可以都試試看哪個順手。

為什麼上傳 Favicon 之後網站上看不到？

這是最常見的問題，通常有幾個原因：瀏覽器快取住了舊的圖標、檔案路徑設定不正確、或者 HTML 宣告有誤。建議的排查步驟是：先用無痕視窗確認，如果無痕視窗能看到就代表是快取問題，清除瀏覽器快取就好。如果無痕視窗也看不到，檢查 HTML 原始碼中的 link 標籤路徑是否正確指向圖標檔案。你也可以搭配 WordPress SEO 外掛 來確認整體的 head 區段設定是否完整。如果你使用的是 DreamHost 等主機服務，通常控制面板也會提供快取清除的功能。

圖標看起來模糊該怎麼辦？

模糊的圖標通常是因為原始圖片的解析度不夠高。建議上傳至少 512×512 像素的圖片到 Iconpie，這樣即使縮小到最小的 16×16 也還能保持一定的清晰度。如果你的 LOGO 本身就有很多細節，在極小尺寸下本來就很難辨識，建議為 Favicon 設計一個簡化版本，保留核心圖形或首字母就好。你也可以用 AI Image Enhancer 或 AI Image Enlarger 嘗試提升原始圖片的品質。

PWA 網站需要哪些額外的圖標設定？

PWA 漸進式網頁應用需要一個 manifest.json 檔案，裡面至少要包含 192×192 和 512×512 兩種尺寸的圖標。Iconpie 產出的 Android 圖標剛好包含這兩個尺寸，所以你可以直接拿來用。同時也別忘了在 manifest.json 中設定 theme_color 和 background_color，這會影響 PWA 安裝時的啟動畫面顏色。如果你用的是 SiteGround 或其他有提供 Cloudflare CDN 的主機，靜態資源的快取設定也要記得處理好，確保 manifest.json 能被正確讀取。定期用 UpdraftPlus 備份網站也是好習慣，這樣萬一改壞了可以快速復原。WP Rocket 則可以幫你處理快取和靜態資源的最佳化，讓圖標載入更順暢。