Change squiggly line color under warnings in VSCode

Question

After installing ESLint in VSCode, I'm receiving some warnings like:

'variable' is assigned a value but never used

The underline color is red, but how do I change that color? I have tried:

"workbench.colorCustomizations": {
    "editorWarning.foreground": "#00FF00",
    "editorError.foreground": "#00FF00",
    "editorWarning.border": "#00FF00",
    "editorError.border": "#00FF00"
}

but they change the color of the underlined border, which is not the squiggly one as shown here:

How do I change that red color into #00FF00 instead?

Answer 1

The answers here talk about changing the color for all kind of errors (not just from the eslint).

I'm not sure this is what intended (at least I didn't want it to behave like that).
I wanted to show all JS errors in red but all ESLint errors in orange (as warnings).

The way to do it is by editing eslint.rules.customizations at the settings:

  "eslint.rules.customizations": [
    { "rule": "*", "severity": "warn" },
  ]

See more info at the ESLint plugin homepage

Answer 2

You probably want to customize your eslint config to set these as warnings instead of errors. But if you want to change the color of all error squigglies in the app, this works for me:

"workbench.colorCustomizations": {
    "editorError.foreground": "#00ff00"
}