I’m engaged on a pwa app. On iOS when I attempt to add it to house display, the app icon has padding that I can not eliminate.
I’m utilizing many various measurement icons in manifest in addition to meta tag apple-touch-icon.
<hyperlink rel="apple-touch-icon" sizes="72x72" href="public/icons/icon-72.png">
<hyperlink rel="apple-touch-icon" sizes="144x144" href="public/icons/icon-144.png">
<hyperlink rel="apple-touch-icon" sizes="120x120" href="public/icons/icon-120.png">
<hyperlink rel="apple-touch-icon" sizes="152x152" href="public/icons/icon-152.png">
<hyperlink rel="apple-touch-icon" sizes="180x180" href="public/icons/icon-180.png">
<hyperlink rel="apple-touch-icon" sizes="192x192" href="public/icons/icon-192.png">
<hyperlink rel="apple-touch-icon" sizes="1024x1024" href="public/icons/icon-1024.png">
Manifest file (solely exhibiting few icons than there are within the precise manifest file, for reference) –
{
src: "icons/icon-192.png",
sizes: "192x192",
kind: "picture/png",
goal: "any",
},
{
src: "icons/icon-256.png",
sizes: "256x256",
kind: "picture/png",
goal: "any",
},
{
src: "icons/icon-512.png",
sizes: "512x512",
kind: "picture/png",
goal: "any",
},
{
src: "icons/icon-1024.png",
sizes: "1024x1024",
kind: "picture/png",
goal: "any",
},
{
src: "icons/icon-48.png",
sizes: "48x48",
kind: "picture/png",
goal: "maskable",
},
{
src: "icons/icon-72.png",
sizes: "72x72",
kind: "picture/png",
goal: "maskable",
},
{
src: "icons/icon-96.png",
sizes: "96x96",
kind: "picture/png",
goal: "maskable",
},
Anybody is aware of why the icons have this pointless padding or what excellent measurement to make use of for iOS?