Apple Touch Icon Guide
When someone adds your site to the iOS home screen, Safari uses apple-touch-icon — not favicon.ico. Ship a 180×180 PNG (or larger square that downscales cleanly) and link it in your <head>.
Apple does not apply masking on modern iOS for web clips the way it does for native apps, but your icon should still be square with safe margins — keep logos inset ~10% so rounded corners never clip artwork.
Use <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">. A single 180×180 file covers all current iPhones; optional 152×152 and 167×167 entries help older iPad layouts.
How it works
- 1
Export 180×180 PNG
From our favicon generator or image resizer.
- 2
Upload to site root
/apple-touch-icon.png alongside favicon.ico.
- 3
Add the link tag
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"> in <head>.
Try it now
Generate apple-touch-icon
Favicon GeneratorFAQ
What size is apple-touch-icon?+
180×180 pixels for current iPhones. Export from a 512×512 or 1024×1024 master.
PNG or ICO for iOS?+
PNG only. iOS ignores .ico for home-screen icons.
Do I still need favicon.ico?+
Yes — tabs and other browsers still use .ico. Apple-touch-icon is additive.