Based on what's written in: https://stackoverflow.com/questions/5110776/apple-touch-icon-for-websites#21144916
We'll want to add a new static file that's supposed to be 180x180 pixels png. Then we can either rely on the default url Apple expects (/apple-touch-icon.png
) or explicitly reference it in HTML:
<link rel="apple-touch-icon" href="/path/to/apple-touch-icon.png">
From a few years ago, Apple suggests (https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html):
<link rel="apple-touch-icon" href="touch-icon-iphone.png">
<link rel="apple-touch-icon" sizes="152x152" href="touch-icon-ipad.png">
<link rel="apple-touch-icon" sizes="180x180" href="touch-icon-iphone-retina.png">
<link rel="apple-touch-icon" sizes="167x167" href="touch-icon-ipad-retina.png">
<link rel="apple-touch-startup-image" href="/launch.png">
<meta name="apple-mobile-web-app-title" content="AppTitle">