Thanks for the awesome theme, it immediately became my favourite one! 😍

However, I rely on VS Code highlighting all occurrences of a variable when my text cursor is placed in one. In the dark theme it is really hard to see those as the contrast between highlight and background is too low.

In following screenshot, the variable value occurs in lines 44, 67 and 72.

is it possible to port this over to visual studio 2019?

Colors of data typres in ruby are not the same. Example is on the screenshot:

This might be irrelevant to this issue but I feel using #fff as white in general is too bright in a dark theme and kind of hurts my eyes. I am not sure if the iOS app uses #fff as white but we can test that out.

Originally posted by @icebeam030 in #19 (comment)

I have installed extension, but on choosing theme VSCode shows an error - extension folder does not have themes directory with dark and light json files. This is confusing. I navigated to .vscode-oss folder with extension and inside github.github-vscode-theme-1.1.2 made

npm i; npm run build

Then extension start to work normally.

I use VSCodium on Mac.

I'd love to give this theme a try, but after installing the extension on my VSCode, I only get the option "GitHub Light". I'm on Windows 10.
I have uninstalled and re-installed again, but "GitHub Dark" is still missing.
Let me know if you need more info.

currently they appear to be default

Next to file icons, VS Code now (1.45) allows to have custom icons for the rest of the UI, like the sidebar or status bar. They call it "product icons". We might can consider using the Octicons V2 for it.

• Not sure if it can be included with this theme or if it needs to be a separate one.
• It seems that we would need to convert it to an "icon font".
• We might need to make additional icons just for VS Code.

/cc @ashygee @colebemis

It looks like this:

I believe it's produced by the theme but it seems like a bug. It's distracting and it shouldn't be there. It should blend in with the colors of sidebar/editor/terminalv etc.

In case the screenshot above shows it unclearly, here is a closeup of it:

Can replicate it 100% of times on vscode version 1.48.0-insider and macOS.

Occurs in both light and dark themes.

Compare to the default Dark+ theme:

...although Dark+ does not italicize the hyperlink itself 🤷

Dunno what the correct styling is here.

When a line is part of a section of folded code, highlighting on that line does not appear.

In the following, L77 is folded, and is highlighted in both cases, but the highlight is not visible.

Please see attached screenshot.

I don't know if it's a known issue, done in purposes or it's a bug. Also I didn't try other font family.
As showing on the screenshot, when set font Family Source Code Pro, all text become dark black. Remove fontFamily fix the problem

OS: MacOS Big Sur
VS Code: Version: 1.47.1

When we edit markdowns in visual studio code, the code blocks are hardly visible with the github theme, e.g. compare vsce publish [version] in the first image to that in the second one (dracula):

Do you know some tools to get token of UI element, like we have with Inspect Editor Tokens and Scopes, but for vscode itself?

Feedback from a DM:

The contrast of the string is a bit light

compared to the default

I've added two tweaks to my settings.json that removes the Tab drop-shadow on scroll:

"workbench.colorCustomizations": {
  "contrastBorder": "#00000000",
  "scrollbar.shadow": "#ffffff00",
},

Result

I've found that it gives the editor chrome a more minimal feel that aligns with the overall visual direction of the theme. I'm not sure if this is something you'll want to implement, so this is just a suggestion.

Normally, when hovering items in the command palette, there's a visible difference in the item's background color to differentiate it from the rest, but the highlight is invisible when using the dark theme.

Light (notice how the Toggle Developer Tools item is hovered):

Dark:

Reported in #10 (comment)

For your consideration:
https://github.com/fcaldera/github-primer-iterm2

Hey! Seems like a colorization bug😛😝

Hi vscode dev here 👋

Seen with GitHub light and GitHub sharp

1. Click on any list, for example explorer
2. Now the element is select and focused
3. Press down, now the elemnt up is just selected, but it has a darker shade than previously 🐛

Selection + focus are stronger than just selection and thus the color should be stronger, not lighter.

I like your theme, thanks for that.

State after step 2

State after step 3

applies to light version
strings look very similar to variables and key-value sets etc

Since 1.43, VSCode themes can take advantage of semantic highlighting.

Every theme controls whether semantic tokens are enabled. Only built-in themes have it enabled by default. It would be great if the GitHub themes enable it by default too.

To turn on semantic highlighting for a theme, all you have to do is put

"semanticHighlighting": true

in the theme's definition file.

With that, semantic tokens will come in from the languages servers and are rendered on top of the TextMate based highlighting. So far TypeScript supports semantic tokens but more languages are in the works (Java, C++, C#).

Semantic tokens have their own classification system and themes can also write rules against this classification system, but we have a default mapping from semantic tokens to common TextMate scopes. For most themes, no adoptions are needed if they cover the common TextMate scopes.

To try this out, just add

	"editor.semanticTokenColorCustomizations": {
		"[GitHub Dark]": {
			"enabled": true
		},
		"[GitHub Light]": {
			"enabled": true
		}
	},

to the user settings.

• Open a TypeScript file, wait for the semantic tokens to come in
• Use the Inspect Editor Tokens and Scopes tool to see the semantic tokens and how they are mapped.

Check out our Semantic Highlighting Wiki and the Semantic Highlighting Guide for more details and feel free to ping me in this issue if I can help.

Really love this theme. How about add some more color contrast in such cases. Thanks:D

VS Code

Github.com

Hope this can support GitHub Markdown favor, especially in checkbox. Or make a new extension for that. Current Markdown extensions on VS Code Market are not so good.

I think this one was accidentally left out

The border around highlighted lines is currently invisible (I assume as a creative decision), however a better way of doing this than what is currently done would be to make editor.lineHighlightBorder transparent, in order to allow extensions to access this "creative decision". For example, this is what a highlighted line looks like in the default editor:

However, the css code var(--vscode-editor-lineHighlightBorder) is still slightly grey, meaning that somehow editor.lineHighlightBorder has not actually been set as transparent by the theme, despite the border being hidden:

(this is also the case with the dark theme)

If window.titleBarStyle is set to custom on Windows or Linux and the GitHub Dark theme is active, the hovered item is invisible in context menus:

For reference, the light theme is fine:

Hi! Cool theme =)

Too dark font in Status Bar in debug mode in dark version of the theme.

Thanks for the great theme!

However, the current theme is not that suitable for .json files, especially for boolean and int types.

It would be better to add most contrast.

I had to create an issue here to say how happy I am with this stellar theme. I've always loved the code highlighting in GitHub, and now I have the same styling and appearance on my code editor that is on the web.

I've used PHPStorm for years, and honestly this theme is making me switch -- it's that pretty.

Thank you! ❤️

I believe now default very orange color is used, so you can barely read highlight text in alt+F12 window. I want to suggest more sane colors for it😄. I'm using dark theme

"peekViewEditor.matchHighlightBackground": "#ffd33d22", // or smth else :)
"peekViewResult.matchHighlightBackground": "#ffd33d22",

Current one

On the split view that previews the difference between the old and modified file, modified lines have a red (for removed) and green (for added). These colors don't have enough contrast and they are quite difficult to spot, specially the reds.

Also, the actual changed text has a different background, but with the current colors it is almost impossible to spot.

You can see the original theme has a much higher contrast, which makes changes easier to see:

Basically #38 , but in different area)

This orange is too intense
We can probably leave a border of this color, but make fill color more diluted

As it stand today, this theme is going to get incredibly difficult to manage with all the hardcoded color values in the light.json theme. Also it will be difficult to auto-generate a dark version of the same theme.

Hence here is proposal. Include @primer/primitives as a dev-dependency and then make a config that is converted to the actual theme file before publishing.

We will use this as the source: https://github.com/primer/primitives/blob/master/primitives/colors.json

Also, we might need the color npm module to make some slight darken(), lighten() operations on the raw color values. This way, the intention behind the choice of the color is always documented.

Hence we will have foreground: colors.gray[8] instead of "foreground": "#444d56".

When syntax becomes invalid, the fg color turns white and makes it unreadable:

I guess the red background color is missing? 🤔 Although we might want something a bit more subtler since this can happen often when editing.

Most of the workspace uses custom color, but there are still some areas that use the default colors. Here a tracking issue if we wanted to customize even more:

• editorWidget
• peekView
• Breadcrumbs border

I'm using %=>% pipe with R. The = and > are colored differently, and thus ligatures are not applied either. Is there a way that everything inside %% can be of same color? Even if this cannot be implemented within the theme, I can make my own fork as long as there is a way to do so. Thanks.

So you can still see the selection.

Maybe not relevant to the theme but how can I change this gutter color to be the same color as the background of the theme (#ffffff in light mode)?

I thought to search #f6f8fa in this codebase but found nothing. I assume this theme doesn't set it?

I also tried to do:

  "workbench.colorCustomizations": {
    "editorGutter.background": "#ffffff",
  },

But that did nothing.

vscode has this error/warning window, you can open it with alt+F8

How about adding a background like in your code snippets in markdown?
For example:

function thunkify(fn) {
  return function() {
    var args = [].slice.call( arguments );
    return function(cb) {
      args.push( cb );
      return fn.apply( null, args );
    };
  };
}

The pure white color makes eyes more tired.

The search highlights could be a bit stronger:

Light:

Dark:

🤔️