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 主屏幕
应用启动器 / 应用抽屉
任务切换视图
启动闪屏 / 启动画面

规范的 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 图标