9

How can I change the color of the line numbers in VS code

enter image description here

Often times the line numbers are to dark to make out.

24

Version 1.12 introduced new workbench theming options (they were experimental in 1.11).

There is a setting for the color of line numbers:

"workbench.colorCustomizations": {
  "editorLineNumber.foreground": "#999999"
}

Some themes also define current line number:

"workbench.colorCustomizations": {
  "editorLineNumber.activeForeground": "#555555"
}

See the Theme Color Reference.

3
  • This also works for CodeSandbox, for anyone looking for how to change the line number color there (it is pretty dim!) – Karl Horky Apr 2 '20 at 16:08
  • More info about the issue with the default CodeSandbox theme here: github.com/codesandbox/codesandbox-client/issues/… – Karl Horky Apr 2 '20 at 16:43
  • Any way to control the background of the overall "line number sidebar"? – jerclarke Jul 11 '20 at 23:22
3

There doesn't appear to be an option to tweak individual colors from a color theme in VSCode (yet?), but there are many color themes to choose from (built-in and 3rd-party), and they do post instructions on how to design your own color theme:

https://code.visualstudio.com/Docs/customization/themes

2

@jerclarke If you want to change the background color of the sidebar containing the row numbers, use:

    "workbench.colorCustomizations": {
        "editorGutter.background" : "#393a39"
    }
0

In Visual Studio 2017 RC it can be done as followed:
Tools -> Options -> Environment -> Fonts and Colors -> Line Number
Don't know if it's the same is VS Code, sorry if it isn't.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.