Apple 触摸图标生成器

生成 iPhone、iPad 用于主屏幕书签的 180×180 apple-touch-icon.png,连同完整 favicon 套件,直接在浏览器中完成,无需上传。

如何生成这些图标

  1. 拖入或选择一张正方形 PNG、JPG 或 WebP——512×512 以上最清晰。
  2. 生成套件:apple-touch-icon.png(180×180)会与完整 favicon 套件一起渲染。
  3. 在预览中调整背景色和图像大小,下载 ZIP,并把 HTML 代码片段粘贴到你的 <head> 中。

关于这些图标

Apple 触摸图标是有人把你的网站添加到主屏幕时 iOS 显示的图像:Safari 会查找放在 /apple-touch-icon.png 的 180×180 PNG。这一个文件即可覆盖所有现代 iPhone 和 iPad——过去那一长串旧尺寸已不再需要。

iOS 会忽略透明度(用黑色填充)并自行处理圆角,因此纯色背景效果最好——预览编辑器里可以设置。OptImg 在你的设备上渲染图标,并与 favicon.ico、PNG 图标、Android 图标、web manifest 和 HTML 代码片段打包在一起。什么都不会上传。

常见问题

Apple 触摸图标应该是多大?
180×180 像素——这是现代 iPhone、iPad 上 Safari 请求的尺寸。旧的 57–152px 变体属于历史遗留,一个 180×180 文件即可覆盖。
图标可以是透明的吗?
最好不要:iOS 会用黑色填充透明区域,并自行处理圆角。请改在预览编辑器中设置纯色背景。
我的徽标会上传到服务器吗?
不会。每个图标都完全在浏览器中渲染和打包——你的图片不会离开设备。
需要什么 HTML?
一个 <link rel="apple-touch-icon" href="/apple-touch-icon.png"> 标签即可——它与其他图标的标签一起包含在套件生成的可复制片段中。