Seems to me like github made this CSS var red now?

background: var(--color-auto-gray-2)

Edit: tried this in incognito on github and it was fine, someone must be conflicting in the extensions then.

background: var(--color-auto-gray-2, var(--bgpr-file-highlight-background))

I've the same issue 😅

Same issue here

Hi! Thanks for reporting. Can someone experiencing this:

1. Test on incognito and report if it happens there
2. List their other installed browser extensions?

I do not see it and it is strange that a variable named gray will be set to red by the GitHub developers them selves.

This is the issue after confirming it doesn't happen in a non-logged into session as well as just disabling the preview feature.

So if you have the Dark High Contrast feature turned on it's making the tree red for some reason just turn it off for now 😅 .

Thanks @Hacksore - any ideas for a one-size-fits-all solution? If we hard code the value, it will not update between themes. Maybe there's a different CSS variable we should use for that color that is consistent across themes. Open for PRs that fix this

As seen in my first post, it happens to me in all themes, not just high contrast dark.

I do have a few other extensions running, need to see if disabling some of them will help.

From what I saw, it looks like some scss file didn't load properly, and all of the different color variables get a default value of red.

This is the issue after confirming it doesn't happen in a non logged into session as well as just disabling the preview feature.

So if you have the Dark High Contrast feature turned on it's making the tree red for some reason so turn it off for now 😅 .

Confirming that turning off the "Dark High Contrast" Feature Preview resolved this issue for me.

i began seeing this issue today but i'm not in dark mode at all, let alone high contrast mode.

here's a list of the extensions installed in incongnito mode, where it also happens.

I too just had this appear today, not using dark mode or high contrast mode. No other extensions enabled for github.com.

This is where the red is coming from:

Thanks everyone. I guess we can not expect a CSS variable named "gray" to be gray...

I can see it as well. I'd be happy to accept pull requests that handle this. The simpler solution, the better.

I'm fairly sure this is a github issue. If you check the network and you load this file it has the bad css, you will see red.

https://github.githubassets.com/assets/colors-v2-0039839a761df7259eecd0c5aa67eabe.css

My understanding is that it's been caused by people opting into the feature preview for high contrast mode but maybe there are other scenarios at this point that load this file.

@berzniz should we open a thread over here to have someone from github look at this?
https://github.community/c/github-help/dark-mode-beta/65

update: even thoughh im not even in dark mode and I never turned on high contrast mode, the feature preview was enabled for me. disabling it fixed the issue

It appears that the auto vars being used come from https://github.com/primer/primitives and have been deprecated. The auto colors are displaying as red to discourage their use. primer/primitives#121

Fix submitted here: #167

Fix merged (thanks @aramperes) today and submitted to Chrome/Firefox stores as version 1.0.34 — this usually takes a few days to be approved and available.