PWA 圖標生成器

為 Android 與 Web 應用生成所需圖標與 manifest。

為 PWA 產生 192x192 與 512x512 圖標，並自動生成可直接使用的 site.webmanifest 設定檔。

Click or drag image here

Supports PNG, JPG, SVG, WEBP

Browser favicons (16x16, 32x32, 48x48)

Apple Touch Icons for iPhone & iPad

Android Chrome icons for PWA

SVG favicon & Safari pinned tab icon

Auto-generated site.webmanifest

PWA-ready favicon & manifest

Generate icons for Progressive Web Apps

隱私 / 安全

在瀏覽器本地處理檔案
不儲存任何上傳內容
生成完成後自動清理資料

適用對象

前端 / 全端開發者
UI / UX 設計師
獨立開發者
SaaS 創業者

適用情境

PWA 應用圖標
Android Chrome 加到主畫面圖標
Web App 安裝體驗最佳化
應用占位圖標

幾秒鐘生成 Progressive Web App 圖標

漸進式 Web 應用（PWA）需要符合規範的圖標尺寸以及有效的 web app manifest。使用本工具，你只要上傳一次圖片，就能自動生成所有必需的 PWA 圖標和可直接使用的 site.webmanifest 檔案。

什麼是 PWA 圖標？

PWA 圖標是在使用者將網站「安裝」為應用時所顯示的應用程式圖標，用來讓 Web App 在各種系統中具有接近原生應用的呈現效果。這些圖標會出現在多個位置：

Android 主畫面
應用啟動器 / 應用列表
多工切換畫面
啟動畫面 / Splash Screen

規範的 PWA 圖標可以讓你的 Web 應用在各裝置上看起來更專業、一致。

PWA 推薦圖標尺寸（Google 建議）

Android Chrome 圖標尺寸

192x192 —— 用於主畫面圖標
512x512 —— 用於應用啟動器與啟動畫面

這些尺寸是通過 PWA 安裝檢查所必需的，缺少會在 Lighthouse 或瀏覽器檢查工具中顯示警告。

我們為你生成的檔案

圖標檔案

android-chrome-192x192.png
android-chrome-512x512.png

Manifest 設定檔

site.webmanifest（預先設定，可直接引用）

範例：

{
  "name": "My PWA App",
  "short_name": "MyApp",
  "icons": [
    {
      "src": "/android-chrome-192x192.png",
      "sizes": "192x192",
      "type": "image/png"
    },
    {
      "src": "/android-chrome-512x512.png",
      "sizes": "512x512",
      "type": "image/png"
    }
  ],
  "display": "standalone"
}

為什麼選擇 favicon.pub 生成 PWA 圖標

符合 Google 要求的圖標尺寸
自動生成 Web App Manifest 檔案
免去手動裁切與輸出多尺寸圖標
相容 PNG、JPG、SVG 等多種來源格式
免費、立即下載

如何將 PWA 圖標接入你的网站

上傳你的 Logo 或應用圖標。
下載生成好的 PWA 圖標與 manifest 檔案。
將檔案放入網站根目錄。
在 HTML 中加入指向 manifest 的連結標籤。

<link rel="manifest" href="/site.webmanifest">

PWA 圖標 vs 瀏覽器 Favicon

類型	用途	建議尺寸
Favicon	瀏覽器分頁 / 書籤	16x16, 32x32
PWA 圖標	應用安裝與啟動	192x192, 512x512

常見問題

是否必須同時提供 192x192 和 512x512 圖標？

是的。現代瀏覽器在 PWA 安裝檢查中會同時檢查這兩種尺寸，缺少會導致安裝提示或稽核工具顯示警告。

PWA 可以直接使用 SVG 圖標嗎？

目前更建議使用 PNG 圖標來確保相容性，即使你的原始檔是 SVG。生成器會替你轉換為相容性更高的 PNG 圖標。

站內相關連結

上傳圖片，立即生成 PWA 圖標