visual-studio-code

How do I change the color of comments in VS Code?


I went through https://code.visualstudio.com/docs/getstarted/theme-color-reference but can't seem to find the setting for changing the comment color.

I am currently using Atom One Dark Theme and just like to lighten the color a little bit so I can read it better.


Solution

  • From 1.15 (July 2017) you can change it from settings.json Ctrl+,

    "editor.tokenColorCustomizations": {
        "comments": "#d4922f"
    },
    

    From 1.20 (January 2018) you can also do it for each theme separately:

    "editor.tokenColorCustomizations": {
        "[Atom One Dark]": {
            "comments": "#d4922f"
        }
    },
    

    Or now you can specify settings for multiple themes at once as "[Atom One Dark][Tomorrow Night Blue]": {...}

    Finding the right scope:

    To find the right scope, you need to open up the tokens and scopes inspector. Press Ctrl + Shift + P to open up the command palette, and then type and search for Developer: Inspect Editor Tokens and Scopes, as shown here:

    enter image description here

    Select it. Now, you can click around on different syntax to see the syntax highlighting scope and information, like this:

    enter image description here

    When done, hit Esc to exit the tokens and scopes inspection mode.

    Selector priority:

    https://code.visualstudio.com/blogs/2017/02/08/syntax-highlighting-optimizations#_textmate-themes



    Ok, more examples (for js):

    "editor.tokenColorCustomizations": {
        "textMateRules": [{
            "scope": "INSERT_SCOPE_HERE",
            "settings": {
                "foreground": "#ff0000"
            }
        }]
    }
    

    comment enter image description here punctuation.definition.comment enter image description here comment.block.documentation enter image description here storage.type.class.jsdoc enter image description here entity.name.type.instance.jsdoc enter image description here variable.other.jsdoc enter image description here