PWA 图标生成器:标准与 Maskable 图标
导出包含 192 与 512 像素的标准、maskable PWA 图标,并在 Web App Manifest 中配置文件引用。
开始创作免费编辑与导出,无水印。AI 生成和 AI 编辑使用积分;完整编辑器适合桌面浏览器。
同一原图,调整构图后导出



示例由仓库演示素材通过图标渲染器生成。具体平台的留白、遮罩和输出以所选预设为准。
操作步骤
- 导入设计,为前景设置足够留白。
- 选择 PWA,检查标准与 maskable 输出。
- 将文件写入 manifest,测试安装后的 PWA 图标。
标准与 maskable 使用独立 manifest 条目
PWA 预设导出 icon 与 maskable-icon 文件。常规图标的 purpose 设为 any,适用于遮罩的文件设为 maskable。尺寸和 MIME 类型声明必须与实际文件一致,manifest 由你在应用中配置。
文件名不能保证遮罩安全
将关键设计放在画布中心、半径为画布宽度 40% 的安全圆内,并让背景铺满边缘。请使用遮罩预览工具检查 maskable 输出;给裁切过紧的 Logo 标注 maskable 仍可能导致主体被裁掉。
当前预设的输出尺寸与文件
以下列表直接读取应用预设。项目配套文件由导出器追加;尺寸选择会影响实际导出内容。容器文件从下载的 ZIP 中提取。
查看 11 个图像输出
| 文件 | 尺寸 |
|---|---|
| icon-48x48.png | 48 × 48 |
| icon-72x72.png | 72 × 72 |
| icon-96x96.png | 96 × 96 |
| icon-128x128.png | 128 × 128 |
| icon-144x144.png | 144 × 144 |
| icon-152x152.png | 152 × 152 |
| icon-192x192.png | 192 × 192 |
| icon-384x384.png | 384 × 384 |
| icon-512x512.png | 512 × 512 |
| maskable-icon-192x192.png | 192 × 192 |
| maskable-icon-512x512.png | 512 × 512 |
常见问题
需要付费或登录吗?
普通图片编辑与导出可免费使用。AI 请求需要登录并使用积分;云同步等服务依据账户方案提供。
工具会自动修改我的项目吗?
不会。先在编辑器预览并下载资源,然后按项目要求手动接入。请保留现有图标备份并测试构建结果。