无需登录 数据私有 本地保存

Apple Touch图标生成器 - iOS固定收藏夹图标

13
0
0
0

Apple Touch 图标生成器

上传图片，一键生成 iOS 主屏幕图标，支持所有尺寸，批量打包下载

拖拽图片到此处

或点击选择文件

PNG / JPG / WebP / GIF 最大 10MB

建议上传 ≥ 1024×1024 像素的方形图片

生成设置
生成的图标

上传图片后将在此处预览生成的所有图标尺寸

常见问题

什么是 Apple Touch 图标？
Apple Touch 图标（apple-touch-icon）是专门为 iOS 设备设计的网站图标。当用户在 Safari 中将网页添加到主屏幕时，iOS 会使用这个图标作为快捷方式的图标。它类似于传统的 favicon，但尺寸更大、更清晰，适合在高分辨率屏幕上显示。自 iOS 1.1.3 起，苹果就引入了这一特性，让网站能够像原生应用一样出现在用户的主屏幕上。
Apple Touch 图标有哪些标准尺寸？
苹果官方推荐以下尺寸：
• 180×180 — iPhone 6s Plus 及更新机型（最常用，推荐必选）
• 167×167 — iPad Pro
• 152×152 — iPad、iPad mini
• 120×120 — iPhone（非 Plus 机型）
• 76×76 — iPad（较低分辨率）
• 57×57 — 旧款 iPhone（iOS 6 及以下）
• 1024×1024 — App Store 展示用
建议至少提供 180×180 和 152×152 两个尺寸，以覆盖绝大多数设备。
如何将生成的图标部署到网站？
步骤很简单：
1. 使用本工具生成所有需要的图标尺寸
2. 将图标文件上传到网站根目录（或任意目录）
3. 将生成的 HTML <link> 标签复制到网页的 <head> 区域
4. 确保 href 路径指向正确的文件位置
部署后，用户即可在 iOS Safari 中通过"添加到主屏幕"看到您的自定义图标。
Apple Touch 图标和普通 Favicon 有什么区别？
主要区别在于尺寸和用途：
• Favicon：通常为 16×16 或 32×32 像素，显示在浏览器标签页和书签中
• Apple Touch 图标：尺寸更大（最高 180×180），专为 iOS 主屏幕设计，需要更高的清晰度和视觉质量
两者互不冲突，建议同时提供。Apple Touch 图标使用 rel="apple-touch-icon" 属性，而传统 favicon 使用 rel="icon"。
iOS 会自动给图标加圆角吗？
是的。iOS 会自动对主屏幕图标应用圆角效果（约 22.5% 的圆角半径），因此您不需要手动给图标添加圆角。实际上，应该上传方形的图标，让系统自动处理圆角。如果您预先加了圆角，iOS 会在圆角基础上再次添加圆角，导致效果不理想。另外，iOS 还会自动添加高光效果（可通过 apple-touch-icon-precomposed 属性禁用）。
上传图片有什么要求？最佳实践是什么？
最佳实践建议：
• 分辨率：至少 1024×1024 像素，以确保生成的所有尺寸都清晰
• 比例：建议使用 1:1 方形图片，非方形图片将自动居中裁剪
• 格式：支持 PNG（推荐，支持透明）、JPG、WebP、GIF
• 内容：图标设计应简洁醒目，避免过多细节，在小尺寸下也能辨识
• 背景：建议使用不透明背景（白色或品牌色），以确保在各种主题下都能正常显示
• 文件大小：建议不超过 10MB
🔧 相关工具