103

There's already a meta post on Contrast and Highlighting with reference to the site redesign, but it doesn't present anything concrete.

There is also a Darker Color for Favorite Tags post, but this is just saying that the pink background for favorites posts is too close to the white background on non-favorites posts (and it has since been made slightly darker).

In the comments section for this answer to another Meta question, the matter of highlighting on favorites in the question list came up and we were directed to open a new case about it.

After the redesign, highlighted favorites now look like this:

enter image description here

This mixture of blue and pink is jarring on the eyes, and it is objectively bad.

The problematic colors here are:

Pink background: rgb(255, 248, 232)
Question title and author name: rgb(0, 119, 204)
Tag background: rgb(228, 237, 244)
Answered ___ ago: rgb(153, 153, 153)

Plugging these into this contrast calculator, we get:

Background vs. question title/author handle:

Brightness difference = 154 (Pass)
Hue difference = 409 (Fail)

Background vs. tag background:

Brightness difference = 12 (Fail)
Hue difference = 47 (Fail)

Background vs. answered ___ ago text:

Brightness difference = 94 (Fail)
Hue difference = 273 (Fail)

Can we please improve this?

On a more subjective note, I find the new style choices really bizarre. This mixture of light pink and electric blue (the blue is not just in the question titles, but on all the buttons as well) and the use of slender sans-serif fonts for the titles seems really out of place on a professional website.

19
  • 28
    I don't think the background is pink. I would say it's cream
    – Oriol
    Commented Jan 18, 2015 at 16:11
  • 7
    You're lucky, at least you get to have bold question titles. I have no idea why those aren't bold for me and I'm on the latest FF. Commented Jan 18, 2015 at 16:30
  • 1
    @Oriol I would definitely call it a shade of pink (light pink). It has way more red in it than the swatch on that cream page (which doesn't look reddish at all). jsfiddle.net/3efmch16/1
    – JLRishe
    Commented Jan 18, 2015 at 16:31
  • @Fred-ii- That might have just been some Snipping Tool distortion. It's not bold for me either. Maybe that's why the title fonts feel so unnatural now.
    – JLRishe
    Commented Jan 18, 2015 at 16:49
  • 1
    What I think they did is that they probably decided on using the same styles/color scheme for both Stack and Meta, which would require less work when wanting to change the look of both in the future. That's how Meta looked before Stack made the change and they should each have their own look/identity, least that's what I think. They just resemble themselves too much. That being the main reason why I didn't visit Meta very much before, the lack of bold titles in the questions feed. It's all just one big whitewash. Commented Jan 18, 2015 at 16:59
  • 3
    Related: meta.stackoverflow.com/questions/283871/…
    – zch
    Commented Jan 18, 2015 at 18:57
  • 35
    whoa, that's pink for you? the strongest channel is red, the weakest is blue, and the green is closer to red than to blue — that makes a yellow leaning towards orange, which is how it appears for me, even in your screenshot. perhaps your monitor needs some serious recalibration?
    – Eevee
    Commented Jan 18, 2015 at 23:02
  • I agree. On my monitor, the difference is practically imperceptible.
    – Azar
    Commented Jan 18, 2015 at 23:28
  • @Fred-ii- cough meta.stackoverflow.com/a/283852/508666 cough wink wink
    – PeeHaa
    Commented Jan 18, 2015 at 23:35
  • 5
    The most important part of this post is the exact shade of pinkish orange off-yellow creme one particular UI element should be named before we paint the bikeshed with it. Commented Jan 19, 2015 at 15:02
  • 4
    Ok, folks, I viewed the color on an iPad and it was indeed a cream color without a hint of red. Must be something screwy with my screen settings, but when I went to calibrate it, all the calibration settings seemed fine. @Yakk name-that-color says that it's called "Early Dawn", so I think we can finally put that matter to rest and focus on the less important points of my post. :)
    – JLRishe
    Commented Jan 19, 2015 at 15:08
  • 7
    @Yakk I think the important part is pointing out that whilst a colour-scheme can appear great on a designer's lovely massive% AdobeRGB Gamut AH-IPS display, maybe he should have a cheapo TN+Film hooked up at the same time so he can see just how mangled his UI contrast is going to be on an average office screen that turns cream into pink.
    – Klors
    Commented Jan 19, 2015 at 15:13
  • 1
    @klors I do not see how that relates to bikesheds. Can we stay on topic here? Commented Jan 19, 2015 at 15:33
  • 1
    @Yakk only if we can go for a complementary colour scheme on the bike-racks
    – Klors
    Commented Jan 19, 2015 at 15:35
  • 2
    I'm colour blind (a common enough problem), and the contrast is way too low for me; 'highlighted' questions are barely distinguishable from the rest
    – Cocowalla
    Commented Jan 20, 2015 at 11:01

1 Answer 1

62

Yes please! On my machine, the highlight is invisible (and vaguely pinkish) when the laptop's screen is at my regular viewing angle:

in normal viewing angle, the highlight is invisible

It only becomes cream and visible if I tilt the screen backwards by around 45°:

highlights are visible when the screen is tilted back

Sorry about the low quality of the images, I took them with my phone. I couldn't use screenshots since, obviously enough, everything looks perfect in those.

8
  • 31
    Ahh! True screenshots...
    – honk
    Commented Jan 19, 2015 at 20:15
  • 8
    Yo Dawg, herd u liked screenshots!
    – Jeroen
    Commented Jan 19, 2015 at 22:29
  • 4
    +1 for 100% my issue and actually including pictures.
    – Janis F
    Commented Jan 20, 2015 at 13:56
  • 4
    The most self explanatory screenshots I've seen so far XD Commented Jan 20, 2015 at 15:13
  • @Jeroen screenshot looks weird as the link to the image is already visible on it, while taking the screenshot... :D
    – Abbas
    Commented Jan 21, 2015 at 12:40
  • @Abbas Glad you noticed >:D
    – Jeroen
    Commented Jan 21, 2015 at 12:59
  • You probably just have a matte screen. I have it too... Found out what it is when it was too late alredy. Commented Jan 21, 2015 at 22:10
  • Exactly the same thing I see on my HP Elitebook Pro. The current .tagged-interesting background is indistinguishable from white unless I put my nose on the keyboard and look up.... Commented Jul 3, 2017 at 21:21

You must log in to answer this question.

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