Written by David Kim — Frontend & WordPress Developer. I make websites look professional, starting with the favicon. More about me →
A client's marketing site had been live for six months before anyone noticed: when you added it to your iPhone home screen, it showed a generic gray placeholder instead of their logo. Six months of lost branding because one line of HTML was missing. I fixed it in 90 seconds using our Apple touch icon generator.
When someone taps "Add to Home Screen" in Safari on iPhone or iPad, iOS looks for an apple-touch-icon.png in your site root. If it finds one, that becomes the home screen icon. If not, iOS shows a gray letter placeholder. The recommended size is 180x180px — Apple's current guideline since iPhone X. Generate your Apple touch icon →
Add this to your site head: <link rel="apple-touch-icon" href="/apple-touch-icon.png">. That is it. Our generator creates the properly sized PNG — just drop it in your site root. Need all sizes at once? Use the multi-size generator →
Written by David Kim — Frontend & WordPress Developer. I make websites look professional, starting with the favicon. More about me →