It's just that the children are worried and so am I. Is it safe?

enter image description here

  • 32
    Nope, not at all. I love it!
    – Taryn
    Dec 4, 2013 at 19:49
  • 27
    Nothing a little jQuery can't fix. Dec 4, 2013 at 19:49
  • 14
    Honestly, I "eeeek"'d a little.
    – Charles
    Dec 4, 2013 at 19:50
  • 16
    I do prefer if the background color was #565656. Dec 4, 2013 at 19:51
  • 41
    I mourn the color.
    – Makoto
    Dec 4, 2013 at 19:51
  • 6
    I like it. The old site was getting old and change is usually good. I just eeeked a bit too because I was just here 30 seconds ago and then I went back and everything was different!
    – A.M.K
    Dec 4, 2013 at 19:52
  • 11
    You just keep watching the top bar. You'll never see the real danger coming.
    – Jaydles
    Dec 4, 2013 at 19:53
  • 8
    I like this bar, but the background color clashes with the clear tone of the whole.
    – Larry
    Dec 4, 2013 at 19:54
  • 8
    Looks good here but it is just disguting on SO.
    – GG.
    Dec 4, 2013 at 19:54
  • 22
    Doesn't fit SO at all :( Dec 4, 2013 at 20:08
  • 21
    it is a clear step backwards.
    – mpapec
    Dec 4, 2013 at 20:19
  • 53
    I hate it. I have to freaking click twice to get from SO to Meta. My SO-to-Meta efficiency has been halved, I tell you! Dec 4, 2013 at 20:21
  • 10
    I thought that they had designers inhouse. Yuk! Dec 4, 2013 at 20:48
  • 16
    The black bar gets too much attention. I really have trouble now to concentrate on a question because of the optical domination of the bar. Sorry but in my opinion a really bad design decision. Dec 4, 2013 at 23:03
  • 9
    "Honey, I'll be a little late coming in tonight, we've installed a new bar at work." - Didn't go over well.
    – user50049
    Dec 5, 2013 at 7:09

13 Answers 13


I used to laugh at people like you. "Timid souls!" I mockingly exclaimed, "No doubt they tremble at their own shadows as well!"

My first introduction to the new top bar came some time ago, when Professor Tunnell left some hastily-drawn sketches laying around in his laboratory. Casually drawn, the lines nevertheless drew one in, their two-dimensional forms somehow suggesting depth, a portal into a strange other world where the normal laws of physics did not apply. "Been drinking again, eh?" I laughed at the old man. "Best not let the others catch wind of your tremens-inspired fancies!"

But late one night last week, I was reviewing some bug reports on Meta and suddenly felt a strange coldness creep up the back of my neck. Turning, I found my view obscured by darkness... A black somehow not black, but blacker than black - and out of it, shone a pale green light. My gaze drawn into it, I found my mind filled suddenly with strange notions of far-away places, my consciousness overwhelmed by eldritch terrors... I ran, the room spinning around me as I stumbled and fell, one word escaping my lips as my screams choked out...


I don't know how long I've been in this place. I don't know where I am, or how I got here, but the people seem nice and listen patiently to my stories before replacing the cold cloth on my fevered brow. One thing is certain though,

I have learned to fear the bar at the top.

  • Solarized
    – krembo99
    Dec 4, 2013 at 23:11
  • 24
    The top-bar does not demand fear! It does, however, demand your respect. And maybe your first-born. Dec 5, 2013 at 9:09
  • 1
    Marc Gravell fhtagn!
    – asteri
    Dec 5, 2013 at 16:54

Wow, that was horrid. Custom style sheet amended.



Edit: Fixed some bugs. I'm going to maintain it in Gallery of custom styles and/or scripts for the top-bar, so please refer to that version.

(n.b. that version does not include the unrelated & commented styles at the end of the below style sheet.)

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("stackoverflow.com") {

  .avatar-me {
    display: none !important;

  .topbar .icon-achievements.icon-achievements-unread,
  .topbar .icon-achievements .unread-count {
    color: #999 !important;
    background: #eee none !important;
  .topbar .topbar-icon:hover,
  .topbar .topbar-icon-on,
  .topbar .topbar-icon-on:hover,
  .topbar .topbar-links .profile-me:hover,
  .topbar .topbar-links .topbar-menu-links a:hover,
  .topbar .icon-achievements.icon-achievements-unread:hover .unread-count {
    background-color: #ddd !important;
  .topbar .icon-achievements,
  .topbar .icon-achievements .unread-count,
  .topbar .topbar-links .topbar-menu-links a,
  .topbar .topbar-links .topbar-menu-links a:visited,
  .topbar .topbar-links .topbar-flair .reputation,
  .topbar .topbar-links .topbar-flair .badgecount {
    color: #999 !important;
  .topbar .topbar-links .search-container input[type="text"] {
    border-color: inherit !important;
  .topbar .icon-site-switcher {
    background-position: 11px 11px !important;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAH8AAAAOCAYAAAAGw8N3AAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3QwEFTgjh/NzFQAAABl0RVh0Q29tbWVudABDcmVhdGVkIHdpdGggR0lNUFeBDhcAAAP5SURBVFjD7Vg9jyNFEH2LLmS5MxJ/wPsHkLw/wf4Jdkhyki2BBOIIxiJ4wSOxJSSI0HkQSKQ2IRGeBCER7eQnkCYgIrrRQciHSV6fisH2zN6uk9WWNLJ7pqe7ql7Vq+o5I/kYwGcAznFc/gDwoaSvcC93Qh4A+BzA6x3mnntuK/gkVwCm4VYOYC6pvi3FSQ4BbCWdddQhSSXp4hX33AHIJc3uBPiSzm9zQZJrAAMA0UFTAEMAm+DEkaTiBlv1O87LG+P6PucNPsnfO87dAdhJetQybwxgImlzBIDrgHcjuStZeiraPz/BuoOU5QeoEwBWJDNJFyTHAFYAes7MWQoekj0AazMHDtEuyQWADMCFpKqFnTIAC5ei5YFxZn0K3y+TbSSvbGNhXaugwzTYkUuaN8pQ7gRB43m0s/T7/VSiXOZWTprSOhUtdn4K4KMDjz94cKhm3kDmABYGtARQASiSopLOHAAzSYkRhn6v9P81yQTi1o4YeW5mR0Ujp3bsZRP4EGxJLgzw0HqWBrpsBMLGuo+Dw1Ng5x5PDciIZD+UtsrzMpK1pGUjMZZeNyNZ2Q8J+DyUymRD334oQvBsg48OyScA3gHwVuP+MwBftNH+zlek0UctNLskWdiQgX8zkvOGEw5Rc+kMGhqYQSObCzskOSaxxiRkZ5eaPwNwFYJrEpxeSJqEYI6ySfo6CMe2oQJwSXLgzC9D4EQZSapJ5gCe274UFEVYux/YLjHFMtiQmGR+BIsXJD8G8GUz6yX9dRLaNwjlHppdttDwvvKBluhe2xnDfaXmUM2XVBmAzIBWoRc5Rqf1vv8hO/stvqnTbwpgS8+M8fJUsqc/2jaW63WA42sA7wF42+PvJH2fuv1bpX2SvT1HuvrI/IGBv0yZG6g6jftHAmBmR21JFo1GEy37ZinbSebev3rFZjTzexehB9hd4/26sW9/TyC09jN7gu0fku8D+AHAnwCeHOv2/0f1XWnfNPic5MZZ2AuOaYLSd7bEMQLVQVJp6l+RXIa1JmFO7r03ruFFDD43Wv9xspusVegltu4zLl0mFj6yppo/7xBUVehJqkDnXaV0qVuFPuhlqXGCrF1Se35+qNQ1MfuR5LcAfpX0S7r/mmk/Xm8AeHjg+rkDpY0ctWs7eNGooSlbMwBrKz/3/CsbVQdnjgLlbf2Rpm7QYlqzt6d8TBvX2D3FIHTxM+u8cF8yT72K9+mSbblBmlqHRONdvytMXG6moeNHKHujEPxjl6ryGsH1BIDijbMOX7SS438C8FTSb/cn5NMLyS2AgaQ3T3nOb5NvADyW9Pc9JCcFe+ysjrSen/ojzzF5CuBdSbt7eE4uVaD1GsAyfQA6lfwLhNsGYDinnG8AAAAASUVORK5CYII=) !important;

  The remainder are all pre-existing and unrelated changes, but I'll include them in case anyone wants to try them

  kbd {
    background-color: #e9e9e9 !important;
    border: 1px solid #999999 !important;
    font-weight: bold !important;
    font-family: Courier New, Fixed, monospace !important;
    font-size: 9pt !important;

  #header ,
  #content ,
  #question-header {
    width: 1280px !important;
  #hmenus {
    width: 1025px !important;
  #mainbar {
    width: 1055px !important;
  #questions ,
  #questions > .question-summary ,
  .question ,
  #answers ,
  #answers-header ,
  .answer {
    width: 1050px !important;
  .post-text {
    width: 980px !important;
  .summary {
    width: 955px !important;

  ...end of commented non-.topbar styles


I noticed this abomination on Stack Overflow and immediately added this to my user style sheet:

.topbar {
    visibility: hidden;

Saved my eyes.

  • 3
    Umm... err... but...
    – Undo
    Dec 4, 2013 at 19:51
  • 65
    DUUUUUDE. You should totally drop that and use jQuery instead. Dec 4, 2013 at 19:51
  • 5
    Try using background-color: #565656. You may like. Dec 4, 2013 at 19:52
  • 8
    How do you plan on navigating the site? Dec 4, 2013 at 19:54
  • 1
    @JoshC I’ll use the API; I need desktop notifications anyway.
    – user146787
    Dec 4, 2013 at 20:06
  • 6
    @rightfold there's an API for websockets? Neat! When did we add that? Dec 4, 2013 at 20:18
  • 1
    I wonder how many other websites use a CSS class called "topbar"... you are going to be so confused...
    – qJake
    Dec 4, 2013 at 20:24
  • 1
    @SpikeX the style sheet applies only to Stack Overflow and Meta Stack Overflow.
    – user146787
    Dec 4, 2013 at 20:42
  • 3
    @AmalMurali How on earth do you expect Mathematicians and Philosphers to use Jquery, FFS. Although SO is the main site, it isn't the only one. Dec 4, 2013 at 22:34
  • 2
    @NickCraver When did I say anything about WebSockets? Anyway, api.stackexchange.com/docs/user-notifications. vOv
    – user146787
    Dec 4, 2013 at 23:06
  • 1
    @rightfold the realtime notifications are done via websockets and aren't immediate in the API. Dec 5, 2013 at 1:06
  • 10
    @Brent.Longborough: I don't think you get the joke. Dec 5, 2013 at 1:22
  • 4
    @AmalMurali Well, you know what? We're going to go back to TeX.SX, where we'll make our own memes... with blackjack... and hookers. Dec 5, 2013 at 4:18
  • 1
    @NickCraver Oh well, I don’t need them immediately.
    – user146787
    Dec 5, 2013 at 8:13
  • 1
    Set background-color: pink;, fixed that for me. Actually screw that. Just drop whatever you're doing and use JQuery instead
    – user216620
    Dec 7, 2013 at 12:36

I am personally very terrified of the new bar at the top.

My gravatar is dark. The background is dark. Here is the result:

Invisible Gravatar

Please, bring the previous top bar back... Immediately!

I remembered of a famous black/white gravatar... so I've tried the top bar with @JeffAtwood 's one. I wonder if he likes it... At least, it contains white, so it is easier to see it.

enter image description here

(Ignore the reputation/badges in the image above; they're still mine.)

  • No need to revert the entire bar to fix this. You can either manually make the background of your Gravatar non-transparent, or a smaller change can be made to the bar which applies a white/gray background for the Gravatar portion of the bar, while leaving the rest the same.
    – asteri
    Dec 5, 2013 at 16:52
  • 3
    @JeffGohlke I'm not against the top bar(my gravatar is fine, also), but the "change your gravatar" option isn't great. I use the same image on every single site I have an account on (to make the NSA's job easier). I don't want to have to start customizing it based on what site I'm on. I do like the background option, though. Maybe it should be turned into a feature request to gain visibility, rather than a comment-on-an-answer on this probably-not-taken-seriously-by-the-staff question.
    – Geobits
    Dec 6, 2013 at 2:49

Once you start down the dark path, forever will it dominate your destiny!! Consume you, it will, as it did meta's apprentice.

Dark Side

so dark

Light Side (Also includes hover-menu)

so light

  • Poor Mace Windu. :-( No purple top-bar here.
    – Jamal
    Dec 5, 2013 at 4:34
  • 6
    At first look I thought the red and green colors were part of your work. Dec 6, 2013 at 10:25

That black is too BLACK for a white background site.

Using this:


I changed it to a different color with a few clicks. (F10 > click Select button > select the toolbar > change color for background and border > OK > Save)

After it's in the browser, it's in our power to make it look like we want!


I will share my opnion on the matter.

Anyone ever seen a new baby that was just born? They are always ugly, no matter what parents say.


So is the new top bar. Ugly at first glance for those who used to see the mature, familiar, top bar.

But it's new. And it's born with new features and lots of efforts were put into it.

Terrified? If I was its parent then yes, it means I should take care of him, look into his bugs and feed him with feature requests. But otherwise no, not really terrified of the change. I'm sure the day will come soon and most users who now oppose it will see his actual beauty.


  • Unabashed +1 for Hugh Laurie
    – asteri
    Dec 5, 2013 at 16:50
  • 12
    For once, it (this top-bar) is lupus.
    – Jamal
    Dec 5, 2013 at 16:54
  • 1
    A +1 for Hugh Lawrie is a +1 for Prince George from Blackadder III
    – McNab
    Dec 5, 2013 at 18:45
  • @Jeff Hugh who? It's Dr. House! ;) Dec 5, 2013 at 19:44
  • 1
    this is seriously scary
    – Flyk
    Dec 6, 2013 at 15:39
  • 1
    Well after a week or so of seeing it at the top of my browser every day, it does look better everytime I look at it. The new features are awesome, though. Dec 7, 2013 at 23:26
  • @SnakeDoc feel free to submit your resume and we'll see your perfect design. Dec 7, 2013 at 23:34
  • @ShaWizDowArd well quite frankly, it was a perfect design how it was - I'm pretty sure this thread as well as the many others on SE attest to that. I'm sorry if you disagree, but it's pretty obvious it was a wrong move by the SE team.
    – SnakeDoc
    Dec 10, 2013 at 17:37
  • @SnakeDoc you can say that on any company who make a design change: be it car, or logo, or taste. There will always be those who won't like the new and miss the old. Dec 10, 2013 at 21:00
  • @ShaWizDowArd In this case, it's a lot deeper. The color difference between the shade of black and the shade of grey (text) was so subtle, that most user's monitors could not/can not accurately differentiate - resulting in a blob of Black with some faint squiggly lines in it. For a site that is about professionals, for professionals by professionals, it's very shocking to see such an example of un-professional work showcased in a big tech rollout (the new features of the bar are aside from it's design theme). Its disfunctional design that inhibits the site's use. That's a problem.
    – SnakeDoc
    Dec 10, 2013 at 22:41

I like the new bar's functionality and don't mind about the additional clicks to get to various things, but I feel it needs a bit of tweaking in the following areas:

  • Overall height of the bar
  • Size of most of the text on the bar

I think the new top bar should be a little bit thinner, maybe thinner to the point that it's tall enough that the user avatar fully fills it top to bottom:

enter image description here

I feel that it isn't as aesthetically pleasing as the old bar due to there essentially being a thick black bar at the top of each page.

Additionally, on Arqade at least, the text on the bar is some of the largest text on the page - larger than pretty much any of the text other than header text, which looks a bit strange.


BTW, I still have had one tab with the old colors open:

enter image description here

until I just refreshed it, now (timeof(1st_edit)).

I definitely miss the review counters. Other than that, after the initial SHOCK, it has sunk in, already used to this new style, so no complaints.


I use opera browser and thought designers added a wrong vendor name to the CSS by mistake and it was going to be fixed soon. Nope :(


You know what they say about going black... (NSFW)

Anyway, people are generally resistant to change at first. But pretty soon you'll grow to love the new bar's charms, like its separate (and very bold) icons for your inbox and recent reputation change, or the ability to easily navigate within the StackExchange network (because who only uses one SE site these days!?).

Give it a few days, it'll grow on you. :)

  • 21
    UGLY doesn't "grow on you".
    – alex gray
    Dec 4, 2013 at 20:35
  • 3
    Well. I thought it was ugly too, at first. Then it grew on me, so... Dec 4, 2013 at 22:24
  • 6
    You have ugly growing on you?
    – Flyk
    Dec 6, 2013 at 17:35

I actually find the bar quite aesthetically appealing. But I'm a fan of dark themes. I like pretty much all of the changes to the navigation bar. I was surprised at first, but it makes me happy. It has a nice, "cool" feeling to it.

The only complaints I have are that I can no longer just click on a button to see the drop-down list of Stack Exchange's "Hot Questions," which was basically the thing I used most on the website. And the amount of darkness in the bar is slightly at odds with the stark whiteness of the rest of the page. But unlike the other posts here, I'd actually prefer if the rest of the site was modified to fit with the dark theme rather than reverting it to the white-and-light-gray it was before.

Multiple themes that a user can choose from in their profile seems like a logical next step from here, since so many people are complaining. I would totally embrace the new and apply the dark theme to the entire site. Subjectively, I think it's awesome.


Some of my own reactions:

  • Friendly icons, more generous spacing in the widgets: Neat, looks clean and welcoming.

  • Instant reputation update: Sort of like a visual "ka-ching"; not sure yet. Saves a trip to the reputation page, but a bit more intrusive.

  • Getting to the reputation page now takes two clicks and an AJAX load, but I can get to Meta's reputation page just as easily: I don't really mind either way.

  • The "privilege levels" have become almost indiscoverable: Meh, screw the newbies.

  • The bar is black: Yeah... the extreme contrast with the page is somewhat of an eye sore. But as I said previously, it nicely foreshadows the upcoming mandatory G+ integration, so history will prove this one right.

Overall, the new bar is an interesting piece of technology and I respect that. I'm not sure it was necessary, but then again, people said the same thing of MS Windows RT.

  • 1
    if SO forces me to use G+, then i'm done. Black on Black top bar was bad enough. Did everyone at SE forget what they were doing?
    – SnakeDoc
    Dec 7, 2013 at 23:27
  • @SnakeDoc: OK, the G+ thing was a joke, because Google pages at some point switched from "works just fine" to "have black bar", thought it was weirdly out-of-character stylistically. Don't worry! :-)
    – Kerrek SB
    Dec 7, 2013 at 23:28
  • 1
    thank god! you scared me! - black on slightly-less-black is bad enough
    – SnakeDoc
    Dec 7, 2013 at 23:31
  • The widget spacing make the bar monstrous in my opinion.
    – einpoklum
    Dec 8, 2013 at 23:23

You must log in to answer this question.

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