This content is outdated and no longer accurate.

Does not provide a valid apple-touch-icon

Published on Updated on

Translated to: Español, Português, 한국어

When iOS Safari users add Progressive Web Apps (PWAs) to their home screens, the icon that appears is called the Apple touch icon. You can specify what icon your app should use by including a <link rel="apple-touch-icon" href="/example.png"> tag in the <head> of your page. If your page doesn't have this link tag, iOS generates an icon by taking a screenshot of the page content. In other words, instructing iOS to download an icon results in a more polished user experience.

How the Lighthouse Apple touch icon audit fails

Lighthouse flags pages without a <link rel="apple-touch-icon" href="/example.png"> tag in the <head>:

Does not provide a valid apple-touch-icon

A rel="apple-touch-icon-precomposed" link passes the audit, but it has been obsolete since iOS 7. Use rel="apple-touch-icon" instead.

Lighthouse doesn't check whether the icon actually exists or whether the icon is the correct size.

In the Lighthouse report UI the full PWA badge is given when you pass all of the audits in all of the PWA subcategories (Fast and reliable, Installable, and PWA optimized).

How to add an Apple touch icon

  1. Add <link rel="apple-touch-icon" href="/example.png"> to the <head> of your page:

    <!DOCTYPE html>
    <html lang="en">

    <link rel="apple-touch-icon" href="/example.png">

  2. Replace /example.png with the actual path to your icon.


Check out the Add an Apple touch icon to your Progressive Web App codelab to see how adding an Apple touch icon creates a more polished user experience.

To provide a good user experience, make sure that:

  • The icon is 180x180 pixels or 192x192 pixels
  • The specified path to the icon is valid
  • The background of the icon is not transparent


Updated on Improve article

This site uses cookies to deliver and enhance the quality of its services and to analyze traffic. If you agree, cookies are also used to serve advertising and to personalize the content and advertisements that you see. Learn more about our use of cookies.