1271054 - After the recent dark theme refresh, the main background blue color in DevTools (especially in Scratchpad) is too bright

Status: RESOLVED DUPLICATE of bug 1270990

(DevTools :: General, defect, P1)

Description

[Kostas]

Using Nightly 49 x64 in win 10 x64.

After the recent dark theme refresh (bug 1205330) 
I find that, the main background color in DevTools (Inspector, Debugger, Style Editor) and in Scratchpad in particular, is too bright,
thus making it as if the monitor's brightness is set way too bright.
Therefore (as a sidenote) in e.g. Scratchpad, the displayed light-purple text color is not easily distinguished from white text (see e.g. line 46 or 62 in screenshot below).
Screenshot: https://i.imgur.com/0lshYKH.png


As a reference, please check two screenshots of popular editors that offer dark themes by default: (notice that the main background color is less bright than that in Scratchpad)
Atom ('One Dark' theme)          https://i.imgur.com/hu8BZOA.png
Sublime Text 3 ('Monokai' theme) https://i.imgur.com/d5rzsGF.jpg
In both cases the main background color is darker (in Atom it's a dark blue, and in ST3 a dark-brown/black).


So, I'd suggest changing the current blue color (#393F4C) into a darker blue (#282C34 , of Atom's theme).

Comment 1

[Brian Grinstead [:bgrins]]

I believe the colors at issue here is --theme-highlight-purple against --theme-body-background.  So, #bcb8db and #393f4c.  When I plug this into http://webaim.org/resources/contrastchecker/?fcolor=bcb8db&bcolor=393f4c I get:

Contrast Ratio: 5.54:1

Normal Text
  WCAG AA: Pass
  WCAG AAA: Fail

Large Text
  WCAG AA: Pass
  WCAG AAA: Pass

Helen, what do you think?  Should we tweak the foreground and/or background color here to hit AAA on normal sized text?

Comment 2

[Helen V. Holmes (:helenvholmes) (:✨)]

I think this this bug is actually referencing var(--theme-selection-background), is that correct Kostas?

http://cl.ly/230G1p3w023k

Comment 3

[Brian Grinstead [:bgrins]]

(In reply to Helen V. Holmes (:helenvholmes) (:✨)(pls ni?) from comment #2)
> I think this this bug is actually referencing
> var(--theme-selection-background), is that correct Kostas?
> 
> http://cl.ly/230G1p3w023k

Setting needinfo

Comment 4

[Kostas]

Helen, no, I'm not referencing to --theme-selection-background. (and, the Scratchpad screenshot in my 1st post doesn't show selections either, as in your screenshot).

I'm referring to the main background color for Scratchpad https://i.imgur.com/O9zyg4o.png
which it's also used as the main background color for e.g.:
Inspector:    https://i.imgur.com/ccFBhm6.png
Console:      https://i.imgur.com/Eeo68yI.jpg
Debugger:     https://i.imgur.com/HtwlNma.jpg
Style Editor: https://i.imgur.com/CYz6Y1E.jpg

which I think it's: --theme-body-background


And, the mentioning of light-purple text color in Scratchpad that I mention in my 1st post, 
> Screenshot: https://i.imgur.com/yZ7h6jm.jpg (see e.g. line 46 or 62).
it's as a sidenote, not the main issue,
so, after changing the main background color, yes, it would be better if you changed that light-purple color (which I don't know its variable name).

Comment 5

[Brian Grinstead [:bgrins]]

It sounds like this report is referencing the colors I mention in Comment 1, so re-flagging needinfo for the question there.

Comment 7

[Helen V. Holmes (:helenvholmes) (:✨)]

The current purple color referenced in the first comment does technically hit AA, which is the target devtools tries to hit. I'm going to use bug 1270990 to do further investigation for fixing/addressing any additional syntax highlighting/theme color issues.

Comment 8

[Kostas]

(In reply to Helen V. Holmes (:helenvholmes) (:✨)(pls ni?) from comment #7)
> The current purple color referenced in the first comment does technically
> hit AA, which is the target devtools tries to hit. I'm going to use bug
> 1270990 to do further investigation for fixing/addressing any additional
> syntax highlighting/theme color issues.

I see that bug 1270990 is now RESOLVED FIXED, 
but the (too bright) blue color #393F4C (that I describe my OP and especially in comment 4) still remains.
How about changing it to a darker one ?

Comment 9

[Kostas]

Setting needinfo

Comment 10

[Helen V. Holmes (:helenvholmes) (:✨)]

We're not changing the background color. We're considering investigating additional text color changes.

The original bug brought this up as an accessibility issue but everything passes AA.