Customize color of text inside `backquotes` in VSC

Question

The only options I can find that deal with custom coloring inside Visual Studio Code are those:

"editor.tokenColorCustomizations": {
    "[Atom One Dark]": {
        "comments": "#FF0000" // only 6 color-customizable
    },
    "workbench.colorCustomizations": {
        "statusBar.background": "#666666",
        "panel.background": "#555555",
        "sideBar.background": "#444444"
    },
},

Is there a way to set a custom color for these types of things? One exists for comments, for strings (inside "string"). I believe something similar should be possible for other stuff using regexps. Thanks in advance.

Answer 1

Search for tokenColorCustomizations and textMateRules and you will find that you can do something like this (see colorizing with textmate):

"editor.tokenColorCustomizations": {

    "textMateRules": [
      {
        "scope": "string.template.js.jsx",
        "settings": {
          "foreground": "#FF0000"
        }
      },
      {
       "scope": "punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end",
       "settings": {
         "foreground": "#F0F"
       }
      },
    ]
}

using the Inspect TM Scopes... command in the command palette. So I used that command to click inside a template literal and got the string.template.js.jsx scope. But that didn't change the ${someVar} so I inspected that scope and saw variable.other.readwrite.js.jsx plus additional scope parameters - still working on isolating that kind of a variable from other variables.

You can also change the fontStyle within a setting. There are a few answers here about using the TM Scopes command.