What is meta? ×
Meta Stack Exchange is where users like you discuss bugs, features, and support issues that affect the software powering all 129 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
4  
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

2 Answers 2

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 is not a good idea sometimes. What if you have a mostly black avatar, like mine? enter image description here

share|improve this answer
    
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

You must log in to answer this question.

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