Android app icon has opaque background

Hi,

Probably quickly sorted but can’t for the life of me figure it out.

Don’t know since when exactly but I think more than a half a year ago something changed when adding my forum’s app icon to the home screen.

All the icons and vingnets etc. In the branding section have transparent backgrounds.

However. Adding the icon to the homescreen now yields an opaque background in the same colour of the logo itself rendering it just one opaque area of the same colour. It seems to select the same colour from the theme somehow.

Side issue but important too: the icon often gets removed from the homescreen so I keep adding it back. Maybe this is after upgrades i will check next time.

I am on Android and using Firefox. Let me know if more info is needed.

Cheers,

Koen

What is the file type you are using for the manifest icon?

Thanksnfornhaving a look. It is a PNG file.

There are a lot more options it seems for uploading all kinds of logos then when I started. Most of them are empty and they then refer to the ones I did upload at the time. Just so you know.

1 Like

Oh, in that case can you go to /admin/site_settings/category/branding?filter=manifest%20icon and upload a new 512x512 PNG in there?

After that try re-adding the site to the homescreen on Firefox Android.

Hey Falco,

Tried it no luck. I can see the logo in it if I look closely, it just takes a solid background color instead of transparent. The picture is postively transparent.

Any other ideas? Here’s the branding settings page

Thanks again and in advance!

Also I’m guessing it is taking the forth color from the colorpalette used for navigation links as the backdrop for the image.

There is a bunch of issues about PWA icon handling of Firefox Fenix on Android, and AFAIK the people who worked on that left Mozilla so work on that has not seen big fixes in the last few years.

You can experiment with maybe removing transparency from your manifest icon to appease the Firefox logic, but that will also affect Android Chrome PWA icon.

Should have tried that out using chrome. Thanks again for coming back.

Funny thing is that chrome makes the background white. Not transparent either.

I’ll perhaps just go with a white background manifest icon and see how that works out.

Cheers!

Koen