Dark Mode diff colors

The red and green background colors used in a diff are tough to differentiate for people like me, who are red/green colorblind.

30 Likes

Appreciate you reaching out and sharing the feedback @pquinn262! We are currently working on designs for other more inclusive color themes to follow today’s new dark theme. We are expecting a red/green Deuteranomaly theme to be one of the first. Can I reach out to you when the time comes to review and give us feedback?

4 Likes

Sounds great. Absolutely, I’d love to check it out.

1 Like

Guys, really don’t like how dark mode is too black.

Dark should mean a dimmed light, not full-on black.

I used to use this plugin, and its colouring is really really good.

New Dark mode is simply too black

@gaknoll

8 Likes

@Henry-Asante Thanks for sharing your feedback with the Atom One Dark example! Dark mode is really just the beginning, so this is helpful feedback for us to understand the different preferences of our users.

I am not colorblind but agree the diff colors are too difficult to discern in dark mode. Thanks!

11 Likes

I’m not colorblind either, but the diff color make it really difficult to read the diffs in pull request reviews.
The greens and red need a bit more contrast.

8 Likes

I’m not red-green colorblind, but these colors are also more effort to differentiate than before, so I’d also like to know about alternatives which pop up (:

4 Likes

I agree with what has been mentioned - I find if very hard to see green and red diff background - this needs to be brighter. I used “Dark Reader” plugin before and that worked better than this in this case. But now even that doesn’t work as green / red has been adjusted in light mode as well?

2 Likes

Basically what it says on the tin: I really like the new look (it means I don’t have to use Dark Reader on GitHub, which speeds up the page considerably), but code reviews are a little more difficult because the contrast for syntax highlighting and diff lines is a little fuzzy for me. Perhaps during the beta phase, provide a way for users to select these colors & submit the palette that works for them to see what kind of consensus can be reached, or perhaps to offer multiple palettes later on.

2 Likes

Similar report here: Dark Mode diff colors

2 Likes

As @idris pointed out, we have been getting similar feedback and appreciate you also taking the time to share your thoughts @fluffynuts! I’m going to merge this with that topic to keep it all in one place.

I’ve shared this feedback with the team and after Universe we’ll return to shipping incremental updates almost daily so hopefully we can improve this for you soon!

I just wanted to echo that diffs are very difficult to discern. I had to turn off dark mode to do code reviews. I think having greater contrast for the background color on additions and deletions may help.

Thanks for working on this everyone, I’m looking forward to switching to dark theme soon.

3 Likes

Thanks for the feedback @divinebovine! We hope to get it to a place where it works for you soon

I find it especially hard to read diffs when there was only one word changed like here (even if your not colorblind):

This is way better in light mode.

Thanks for your great work!

1 Like

Also not colour blind here, but definitely find the dark mode diff harder to make out during code reviews etc. I agree with both sides of the feedback you’re getting, partly less contract and partly more!

To explain, the text I’m getting is quite bright and the oranges, purples etc that seemed a little muted on the white background really seem like a lot against the dark. The red and green backgrounds for the diff text in comparison are very easy to lose under everything else going on. See here for an example where the transition from dark to red to green background is very hard to follow:

Other than that, dark mode is definitely super welcome, especially for the the late night sessions where switching from a darker IDE to a full white monitor for github is pretty blinding.

It would be nice to have another dark theme that is tinted with a “warm” hue (more reddish than blue-ish).

The current version is slightly blue, and “cool”. Sometimes at night it is more comfortable to block more blueish light and switch to a warmer tone.

Something like this dark background on Supabase: https://supabase.io/

1 Like

Thanks @raeffu and @BarryDahlberg for sharing your feedback as well (with screenshot examples)! Our current diff views have been getting quite a bit of feedback so this will be high priority in our backlog to iterate on soon

1 Like

@cdock1029 this feedback has come up as well in one of our other topics as well. Thanks for taking the time to share it! Dark mode is really just the beginning so all this feedback helps us as we look to what themes we should introduce in the future

1 Like

Great! Yes that linked example shows the issue in clearly (and I might have overstated the need to tint the background “warm”, though that might be beneficial as well), the biggest issue is not tinting it “blue” at least.

The side by side in that example shows, and others attest to, blue tinting makes contrast and clarity lower. It is the same effect of using “white” (more blue spectrum) LED’s at night vs more warm spectrum light. Straight gray, or warm gray is much clearer.

2 Likes