Transparent avatars should be rendered with a transparent bg, not a white or black one.

[ara4n]

There are folks like nepugia & kythyria who have avatars with transparent backgrounds. Currently in Riot we force a white background for avatars so in practice they ended up rendered on white. However, in practice, we should probably render them as transparent on whatever bg is suitable for the theme being used (i.e. either light or dark), to avoid breaking the theming.

If this results in a black-on-transparent avatar against a black bg being invisible, then the user shouldn't have uploaded a black-on-transparent avatar in the first place; they should have uploaded black-on-white instead.

In other words: if you upload a transparent avatar, you'd need to make sure it looks good on both light & dark bgs. Woe betide you if the app implementer chose a colourful bg colour (e.g. purple or yellow) which then makes nepugia or kythria disappear into the wallpaper (and even then, they should be including a border around such avatars anyway).

See also #6305

[turt2live]

Related:

• White background on .mx_BaseAvatar_image makes dark profile pictures look terrible on dark theme #4712
• typing notif avatars with white background looks a bit weird #3035
• Customisable lightbox background colour for transparent images #286
• Handle transparent images better #91

[rxl881]

As per @ara4n's comment on #8558

• if you want your avatar to have a light background, you should upload one with a light background.
• if you want your avatar to have a dark background, you should upload one with a dark background.
• if you want your avatar to have a transparent background so that it fits into both light and dark themes, you need to design the artwork to work on both light and dark backgrounds (e.g. not upload a black-on-transparent avatar and then wonder why it's invisible in a dark theme).

I think that @matthew is right, but there will be a lot of existing avatars out there that will look pretty broken / invisible in the current setup. Could this be fixed by adding a hairline border (with the same colour as the room list separators) around the avatars, so that at least you can see that they are there, regardless of the content?

[rxl881]

Matthew just pointed out that it's actually trivial to download the original artwork and re-upload with a white background (I didn't know that you can get at the original artwork by clicking on the avatar in the room view heading)

[peyremorgan]

If you decide to make it the responsibility of the user to ensure his avatar fits into both themes, i'd suggest displaying a preview of the avatar on light and dark backgrounds when uploading a transparent image.

Quick mockup (based on twitter's UI):

[robintown]

Nowadays transparent avatars are in fact transparent, and get a background that matches the theme.