Icon Missing When Adding a Webpage to the Android Homepage

Problem: when adding a shortcut of a webpage to the Android home screen, Chrome used <link rel=”icon” …> to give this shortcut an icon. Lately Google Chrome broke this feature (intentionally probably). Chrome just shows a grey round circle with a single letter instead of the provided icon.

Discussion: Google removed it’s claim “don’t be evil” some years ago, and is evil now ;-), and is breaking features and closing services and interfaces constantly (https://killedbygoogle.com/)

Work around: I found a work around. If you add webmanifest to your webpage and give it at least a “name” attribute, the provided icon shows up again. Add this line to your webpage:

    <link rel="manifest" href="site.webmanifest"> 

and add a file with this name “site.webmanifest” , looking like this:

{
    "short_name": "jazz.w3.at",
    "name": "jazz.w3.at",
    "icons": [
         {
           "src": "logo-192.png",
           "type": "image/png",
           "sizes": "192x192"
         }
    ]
}

“short_name” and “icons” is optional. If “name” is in there chrome uses the old <link rel=”icon” … > as it allways did, before google broke it.

On Android launchers with round icons Chrome may build this icon bye placing your icon into a white filled circle. If you want your icon without a white circle and your icon can be cut to a circle shape, add this attribute to the icon in the webmanifest file:

           "purpose": "maskable",

Version: tested with “chrome 123” on “android 14” on “nothing os 2.5”