7

I'd like to customize VSCode colour settings in general for dark or light theme variants, for example:

"workbench.colorCustomizations": {
    "light": {
        "editor.background": "#ff0000",
    }
}

To my knowledge, however, it's only possible to define colours for all situations or for specific themes, e.g.

"workbench.colorCustomizations": {
    "editor.background": "#ff0000",
    "[Default Light+]": {
        "editor.background": "#ff0000"
    }
}

Problem with this solution is, that it applies everywhere or for one specific theme, not any light-variant theme in general.

Actually, colours do have default values for dark/light/high-contrast variants. For example, when adding colour through contributes.colors in an extension's package.json, this is how one does it:

"contributes": {
    "colors": [
        {
          "id": "mycolour",
          "description": "my colour",
          "defaults": {
            "dark": "#ffffff",
            "light": "#000000",
            "highContrast": "#010203"
          }
        }
    ]
}

Is there any way to customize a colour's generic variants in the user settings, just like in contributes.colors? The documentation I've found on this topic is not what I'd call exhaustive (just a few examples basically), but there might be things that I missed. Also, I used workbench.* in the above examples because I'm mostly interested in that setting, not in the editor.* colour settings.

  • Thanks, your question actually includes a workable solution for me. I like high contrast, so I like to put my background to #000000. But if I need a lot of brightness (working outside) I sometimes switch to a light theme. My problem was that my background remained #000000. Your "[Default Dark+]"-trick solves my problem entirely, because I only switch between 2 themes. I guess if I find another favourite theme later, I can just copy the settings to that theme as well – Jules Colle Sep 28 '21 at 18:59
  • @Jules, I am happy you found some information of value here, but the [Default Dark+] label is not a trick; it's merely the name of a specific dark theme in VScode that you happen to be using. The name can mislead you to think it's a generic label of sorts, but it isn't - settings under that label won't apply to other themes. – uEv340yQ3gU1 Sep 30 '21 at 03:17

2 Answers2

6

Looks like based on @uEv340yQ3gU1's answer that for the time being this feature isn't supported. However over at https://stackoverflow.com/a/69200037/17196251 I found out that specifying multiple themes and wildcards are now supported! See https://code.visualstudio.com/updates/v1_59#_extended-theme-customization-syntax

We can do a decent workaround by specifying the wildcard [*Light*] or [*Dark*] (along with any themes you use often e.g. Monokai). Looks something like this

"workbench.colorCustomizations": {
    // Default
    "editor.background": "#000000",
    // Exception for light themes
    "[*Light*][AnotherTheme]": {
        "editor.background": "#ffffff"
    }
}

I currently use this for specifying custom bracket colorization to use white for the first bracket on dark themes and black on light themes! Woo

pargrey
  • 61
  • 1
  • 5
1

As it turns out, it's not possible yet. There's a feature request for this functionality (https://github.com/microsoft/vscode/issues/101418), so, hopefully, it might be added in the future.