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.
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.