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”