visual-studio-code

In VS Code, how can I change the snippet insertion variable color


I've tried many VS Code color themes, and all have the same problem for me. I cannot read the area of the snippet variable I'm typing in because the text and background almost match. I've tried adjusting properties in the theme and none seem to work. Wondering which item I need to change in the theme to edit the background color of variables being entered for snippets if it exists.

Here are the properties I've tried:

{
  "editor.findMatchBackground": "#b7c5d380",
  "editor.findMatchHighlightBackground": "#b7c5d330",
  "editor.findRangeHighlightBackground": "#243E51",
  "editor.hoverHighlightBackground": "#333F4A",
  "editor.inactiveSelectionBackground": "#1D252C",
  "editor.lineHighlightBackground": "#28313a",
  "editor.lineHighlightBorder": "#28313a",
  "editor.rangeHighlightBackground": "#28313a",
  "editor.selectionBackground": "#28323a",
  "editor.selectionHighlightBackground": "#28313a",
  "editor.wordHighlightStrongBackground": "#41505e",
  "editor.wordHighlightBackground": "#FFFFFF0D"
}

sco


Solution

  • Try:

    "workbench.colorCustomizations": {
        "editor.snippetTabstopHighlightBackground": "#ff0000",
    }
    

    or other snippet colors that can be changed:

    "editor.snippetFinalTabstopHighlightBackground": "#ff0000",
    "editor.snippetFinalTabstopHighlightBorder": "#ff0000",
    "editor.snippetTabstopHighlightBorder": "#ff0000",
    

    I just typed snippet into the colorCustomizations options and Intellisense found those.