Why is the transition: background red in syntax highlighting (Visual Studio)?

user_7090668 0
Viewed 219

I am a teacher and had a student ask why the "background" is red in color. This is in Visual Studio Code using the Dark+ theme. I have tried looking in the settings for syntax highlighting to identify different colors, but haven't had any luck. Same with browsing the web for this theme's color usage.

enter image description here

visual-studio-code css
2 Answers

Answer

The syntax is red because VSCode marked it as invalid/deprecated code, and the Dark+ theme has this scope set to #F44747 (red).

Example

Override default style

In case you're looking to change the default foreground (color) or the default fontStyle of this scope, you can go to vscode command prompt and select Open settings (JSON) then add the following :

"editor.tokenColorCustomizations": {
  "[Default Dark+]": {
    "textMateRules": [
      {
        "scope": ["invalid.deprecated.color.system.css"],
        "settings": {
            "foreground": "#F44747",
            "fontStyle": "italic strikethrough"
        }
      },
    ]
  },
}

Result:

result

user_111491060

background is not an animatable property. More on this here.

You may use background-color instead.

user_65128570
Related