PWA 图标与启动屏生成
一张源图 → 全套装机资源：各尺寸图标 + maskable + favicon.ico + manifest + iOS 各机型启动屏 + 可粘贴的 HTML 片段
源图
把图标拖到这里，或点击选择
推荐 SVG 或 ≥512 的正方形透明 PNG
背景与留白
maskable 图标固定按 80% 安全区绘制（每边 10%），不受此值影响。
格式与命名
manifest 字段
图标尺寸
180 会输出成 apple-touch-icon-180.png（Apple 约定名），其余为 icon-N.png；勾选 maskable 时同尺寸再多一份 -maskable。
启动屏机型
iPhone（0 条）
iPad / iPod（0 条）
机型清单快照版本 （来源 pwa-asset-generator 内置表，MIT 许可）。 Apple 已在 2026 年 9 月撤下官方的启动屏尺寸表，所以这类清单都是手工维护的快照——新机型没列出时，用上面的自定义视口按「CSS 尺寸 @DPR」补一条即可，不用等本页更新。 清单里很多机型视口与 DPR 完全相同（例如 iPhone 12 / 13 / 14 / 16e），本页会按媒体查询去重，同一份图只出一张、一个 link。
产物
PWA 装机要的不是「一张图」，而是一整套按平台规矩摆好的资源。Android 侧（Chrome）读 manifest.webmanifest 里的 icons 数组，至少给 192 与 512 两档才能拿到像样的装机与快捷方式体验；iOS 侧至今不靠 manifest 定启动画面，而是要求为每一种屏幕尺寸各写一条 link rel="apple-touch-startup-image" 并带上精确的 media 查询，尺寸对不上就不显示——这正是手工维护最痛的地方，本页把它整块自动化了。
maskable 图标必须单独一套。Android 桌面会把图标按圆形、圆角方形等模板裁一刀，满铺设计的边缘（文字、细边框）会被切掉。规范做法是把内容收在中心 80% 的「安全区」内、四周留背景色，本页生成 -maskable 版时固定按 80% 安全区绘制，并在预览里画出安全区虚线。manifest 中它作为独立的 purpose: "maskable" 条目与 "any" 并列，浏览器各取所需。
机型清单会过期，所以本页把它当数据而不是秘密。Apple 于 2026 年 9 月从人机界面指南中撤下了启动屏尺寸表，社区（含本页所依据的 MIT 快照）只能手工维护。好消息是媒体查询只由「CSS 尺寸 + DPR + 方向」决定：59 条机型里其实只有 46 个唯一组合，iPhone 12 / 13 / 14 / 16e 共用同一张图。因此本页对同一媒体查询只出一张图、一个 link——重复堆 link 只会多出废字节，iOS 对同一个媒体查询只会用其中一条。新机型上市时，用「自定义视口」按 393x852@3 这种格式补一条，立刻可用。
深色启动屏有个 iOS 硬限制要知道。本页会生成 -dark 后缀的一组图，并把媒体查询写成 (prefers-color-scheme: dark) and (device-width: …)。但 iOS 只在添加到主屏幕那一刻读取并缓存启动图：用户之后切换系统深浅色，已装好的应用启动图不会变，必须删掉重新添加。这条不是本页能解决的，写在这里是为了别让它变成你的线上疑问。
favicon.ico 是本页自写的容器。图标先用浏览器原生 canvas.toBlob 编成 PNG，再把多张 PNG 按 ICO 的目录结构（6 字节头 + 每帧 16 字节目录项 + 图像数据）拼成单个 .ico。Vista 之后的浏览器都认 ICO 里装 PNG，因此不需要额外的位图编码；256 像素这一档按规范把宽高字节写成 0。若你的站点已全面支持 PNG favicon，这一项可以不要。
整个过程没有服务器参与。解码、缩放、绘制、JPG/PNG 编码、ICO 拼装、manifest 与 HTML 生成、ZIP 打包全部在你的浏览器里完成（ZIP 由自托管的 JSZip 生成），图片不出本机，也不写任何 cookie 或登录态；刷新页面即清空。
常见问题
本页产出的是「装机资源包」：各尺寸图标（含 maskable 一套）、apple-touch-icon-180、favicon.ico、manifest.webmanifest、iOS/iPadOS 各机型启动屏，外加一份可直接粘进 head 的 HTML 片段，打包成一个 zip。只想拿几张不同尺寸的 PNG 图标（做 favicon、给设计稿用）请用「图标多尺寸导出」，那一页更短更直接，也不涉及 manifest 与启动屏。
因为启动屏的媒体查询只由 CSS 尺寸、DPR 和方向决定，跟机型名无关。iPhone 12、13、14、16e 都是 390×844@3，共用同一张图同一个 link，所以本页按媒体查询去重：清单 59 条机型实际只有 46 个唯一组合。这样既不会漏（去重是按查询精确合并的，合并后仍在同一行显示覆盖了哪些机型），也不会给 head 塞进几十条重复 link——同一个媒体查询 iOS 只会用其中一条，其余纯属废字节。
Android 桌面会把图标按圆形、圆角方形等模板裁一刀，满铺图标的边缘内容会被切掉。maskable 图标要求把主体收在中心 80% 的安全区里、四周用背景色填满，桌面裁切时就不会伤到主体。本页勾上 maskable 后会在同尺寸外多出一份带 -maskable 后缀的文件，并在 manifest 里作为 purpose 为 maskable 的独立条目与 any 并列；预览格上画的虚线圆就是安全区，可以一眼看出会不会被裁到。
首推 SVG：启动屏最大边到 2868 像素，源图会被放大，位图放大就糊，矢量不会。用位图的话给最长边不小于 1024 的正方形透明 PNG 更稳。源图不必是正方形，非正方形会按短边等比缩放并在画布内居中（contain），不会拉伸变形。透明背景请选 PNG，选 JPG 时浏览器会把透明压成白色，本页会在你这么选时直接提醒。
勾上深色后会多出一批 -dark 结尾的图，link 的媒体查询写成 prefers-color-scheme: dark 加原尺寸条件，系统按当前深浅色挑一条。但 iOS 只在「添加到主屏幕」那一刻读取并缓存启动图，之后切换系统深浅色不会更新已装应用的启动图，必须删掉图标重新添加一次。这是 iOS 的限制，不是配置错了。
清单来自 pwa-asset-generator 随包内置的那份 iOS/iPadOS 启动屏尺寸表（MIT 许可），页面在机型清单区块里标了快照日期。Apple 已于 2026 年 9 月从人机界面指南中撤下官方尺寸表，现在这类表都是社区手工维护的快照，所以本页把它当可读的数据摊开展示，并留了自定义视口：按 CSS 宽×高@DPR 的格式（例如 393x852@3）填进去就能立刻生成，不用等本页更新清单。
ICO 只是一个容器：6 字节文件头加每帧 16 字节的目录项，图像数据可以是位图也可以是 PNG。Vista 之后的所有主流浏览器都支持 ICO 内嵌 PNG，体积也小得多，所以本页把 16、32、48 三档 PNG 原样装进一个 ico 文件（256 像素档按规范把宽高字节写成 0）。只有还在支持二十年前的老浏览器时才需要传统的 BMP 位图帧。
不会上传。解码、缩放、绘制、JPG/PNG 编码、ICO 拼装、manifest 与 HTML 文本生成、ZIP 打包全部在你的浏览器里进行，图片不出本机，刷新即清空。规模上：全套含深色约一百二十多张图，逐张绘制完立刻释放画布内存，JPG 默认质量 70 时整包通常几 MB；如果只想先验证效果，先把机型点成「仅 iPhone」再清掉横屏，几十秒内就能出包。