What is meta? ×
Meta Stack Exchange is where users like you discuss bugs, features, and support issues that affect the software powering all 133 Stack Exchange communities.

With the new top bar, my profile picture displays very ugly:

  enter image description here

It has a transparent background, which is transformed into white. This used to be somewhat okay, but now the picture is used in two different contexts: white in some pages, grey user boxes, black top bar… and it keeps its white background all the time. In the top bar, it's especially ugly.

We're in 2013, transparent PNG, like Unicode, has been around a long time. Can we have transparency please?

share|improve this question
3  
That's actually a task for imgur who handles the thumbnails creation, but I totally agree. –  Shadow Wizard Dec 5 '13 at 9:18
3  
@ShaWizDowArd but that's SE team who can post a feature request to imgur, so asking here was the only thing F'x could do :) –  Mołot Dec 5 '13 at 9:41
5  
It works for gravatar images with transparency, but it is rather annoying to be unable to use the SE-internal avatars with transparency. –  Mad Scientist Dec 5 '13 at 10:07
    
@MadScientist wonder if animation is working too in gravatar? ;) –  Shadow Wizard Dec 5 '13 at 11:03
    
I had the same problem but when I created a new account on a different Stack Exchange the transparency was generated. Is this possibly some kind of caching issue? –  Rory Dec 7 '13 at 19:49
    
Interestingly, the accepted answer on this thread indicates that the issue was fixed back in March - yet, as I posted in that thread, it's still present. –  Aleks G Dec 18 '13 at 8:42
    
I should point out that the icon avatar in that little grey box on this question doesn't appear to have a transparent background either. –  MichaelT Jan 18 at 20:34

3 Answers 3

It wouldn't be hard to fix this for the top bar only with a user script; in fact, the following code will do it:

$('.topbar img.avatar-me[src^="http://i.stack.imgur.com/"]').attr(
    'src', function (i,v) { return v.replace(/\?.*$/, '') }
);

This is slightly wasteful of bandwidth, since it uses your full-size avatar image, but it shouldn't make that much difference as it will only affect you, and your browser will cache the image anyway.

However, I'm not sure how much point there would be in doing this, since the change would only be visible to you, and only in the top bar. What we really need is a proper fix to Profile picture cannot have transparent background, and that's something that Imgur needs to do — it's not something SE can fix on their own (other than by switching to another image host).


Edit: I went ahead and included the fix above into version 1.4 of the Stack Overflow Unofficial Patch, a collection of client-side CSS and JavaScript fixes packaged as a GreaseMonkey-style user script. If you're using a compatible browser (Firefox, Chrome, Opera, possibly Safari and others, but unfortunately not IE or most mobile browsers), feel free give it a try!

share|improve this answer

This appears to be an issue with the imgur upload option as some commenters are suggesting - if you use the Gravatar option it appears to be working as expected:

Nav Bar:
Nav Bar, image on black

Profile Page (activity):
Profile Page, image on white

New Profile (profile):
Profile Page, image on Grey and White

Check that the gravatar you're using has a transparent background (mine was a .png if that helps).

share|improve this answer
    
Interesting. This definetely does not work for avatars uploaded to Stack Exchange (i.e., Imgur) directly. (At least a few days ago.) –  Wrzlprmft Dec 1 at 10:08
    
Yes - you've got a point there - I've never tried to use the "Upload image" option, always going for the Gravatar option (mainly because it wasn't an option when I started, and I use it elsewhere)... –  Zhaph - Ben Duguid Dec 1 at 10:10

This is not a good idea sometimes. What if you have a mostly black avatar, like mine? enter image description here

share|improve this answer
6  
Then you would add a white background to the image yourself? –  3ventic Mar 23 at 15:03
    
@3ventic But the image background should still be transparent in other places, like on other SE sites where the background color is not white. –  E.A. Wilson Mar 23 at 15:09
    
What Stack Exchange site has a background color for posts that is not white? –  Shadow Wizard Mar 23 at 15:24
4  
@ShadowWizard: The Meta of Science Fiction & Fantasy. The main site’s background is also slightly grey. However, I think that the problem described here is the lesser evil than having no transparent avatars at all. –  Wrzlprmft Nov 28 at 11:14
    
@Wrzlprmft Your right. It's annoying for a very small amount of users, and it's not common enough to justify making an option for non-transparent avatars. –  E.A. Wilson Nov 29 at 22:50
    
Check my avatar for example, there is a brownish white glow in the background surrounding the image which makes it work on black backgrounds yet is virtually invisible on white backgrounds. –  David Mulder Dec 1 at 21:20

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .