FaviconStudio

Apple Touch Icon Generator

Create a correct apple-touch-icon.png (180×180) for iOS Safari home screens — included free with every FaviconStudio download.

Create apple-touch-icon free →Android Chrome sizes

What is an apple-touch-icon?

When someone taps Share → Add to Home Screen in Safari on iPhone or iPad, iOS looks for a dedicated touch icon — not your 16×16 tab favicon. That file is conventionally named apple-touch-icon.png and should be 180×180 PNG. Without it, iOS may show a blurry screenshot of your page instead of your brand mark.

Required size (2026)

AssetSizeRequired?
apple-touch-icon.png180×180Yes
apple-touch-icon-152x152.png152×152Optional (older iPad)
apple-touch-icon-167x167.png167×167Optional (iPad Pro legacy)

FaviconStudio exports apple-touch-icon.png at 180×180 in every ZIP alongside tab icons and the PWA manifest.

HTML to add in your <head>

<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">

Place the PNG in your site root (or public/ in Next.js). Keep the path absolute so it works on every page.

Design tips for iOS tiles

  • Use a solid or branded background — iOS can fill transparency unpredictably.
  • Keep the mark simple; fine lines disappear when the tile is scaled down on the home screen.
  • Leave a little padding so iOS rounded corners do not clip your logo.
  • Still need Android install icons? See Android Chrome icon sizes.

How to generate yours

  1. Open the free favicon generator.
  2. Create from text, image, emoji, or icon.
  3. Download the ZIP — it includes apple-touch-icon.png plus ICO, PNG sizes, and site.webmanifest.
  4. Upload the files and paste the HTML snippet into your site head.

Related tools