How to change the colour of region/endregion in VS Code?

Question

Does anyone know how to change the colour of #region/#endregion? This is greyish in VS Community but not on VS Code.

Thank you in advance.

Answer 1

Because the terms #region/#endregion are part of a comment, looking at their scopes with the command Developer: Inspect TM Scopes gives you only a comment scope so if you change the comment scope by the following tokenColorCustomization:

"editor.tokenColorCustomizations": {
    "comments": "#ffa600b0"
}

will change all comments - probably not what you want. Plus you can only change the fontColor and fontStyle (like italics) there.

Better is using the extension Highlight to find, via a regex, what you want to highlight.

Using //#region - your language may have different comment indicators at the start. If so, modify the first capture group (//\\s*) below.

  "highlight.regexes": {

    "(//\\s*)(#region|#endregion)": [

      // the first capture group, the '//' uncolored here, but must have the entry below
      //  you could color those separately if you wish
      {},

      // capture group: #region or #endregion
      {
        // "overviewRulerColor": "#ffcc00",
        "backgroundColor": "#f00",
        "color": "#fff",
        // "fontWeight": "bold",
        "borderRadius": "3px",
      },
    ]
  }