How to customize colours in vscodium?

Question

Following this answer https://stackoverflow.com/a/55113171/324969 and this answer https://stackoverflow.com/a/60686826/324969.

If I press Ctrl+, comma, search for "Color" in the settings, click one of the Edit in settings.json, paste the following so that it is the entire contents of the file, and restart vscodium, it has no effect: the tooltip which is shown when the mouse cursor is on some part of the code is opaque instead of semitransparent, and the colour of the comments is black instead of red.

{
    "window.zoomLevel": 0,
    "workbench.colorTheme": "Atom One Light",
    "editor.tokenColorCustomizationsExperimental": {
        "variable": "#ff0000",
        "*.comment": "#ff0000",
        "*" : "#ff0000",
    },
    "workbench.colorCustomizations": {
        "editorSuggestWidget.background": "#ff000060"
    }
}

How do I configure things related to coulour in vscodium? I'm asking a question for that because it seems that I don't know something that needs to be done to make settings.json work in general.

Maybe this is a vscode-only feature? Or maybe I am editing the wrong settings.json file somehow? Or maybe some plugin prevents this from working? There are a couple of .editorconfig files in subdirectories of the git project that unrelated to the subdirectories in which I am working. These .editorconfig files don't contain anything about colours, just indentation and EOL settings. Maybe the mere presence of these files prevents settings.json from working? Maybe the answers linked above are outdated and the customization happens via a different mechanism now?

I'm running the Atom One Light Theme 2.2.3 and OCaml with:

Version: 1.41.1
Commit: 26076a4de974ead31f97692a0d32f90d735645c0
Date: 2019-12-19T20:28:43.121Z
Electron: 6.1.5
Chrome: 76.0.3809.146
Node.js: 12.4.0
V8: 7.6.303.31-electron.0
OS: Linux x64 5.4.0-60-generic

score 0 · Accepted Answer · answered Feb 17 '21 at 15:06

The hover box needs editorHoverWidget.background instead of editorSuggestWidget.background (that's for the autocomple drop-down).

The comment colour needs

    "editor.tokenColorCustomizations": {
        "textMateRules": [{
            "scope": "meta.separator",
            "settings": {
                "foreground": "#9c9c9c",
                "fontStyle": "bold"
            }
        }],
    },

where meta.separator can be obtained by running Ctrl+Shift+P Developer: Inspect TM Sopes and placing the cursor on the text to be coloured, and copying the middle part which uses a tt font in this version of vscodium, see the screenshot below where meta.separator { "foreground": "#9c9c9c", "fontStyle": "bold" } is highlighted.

So it's not a problem with settings.json being ignored, it's just that the names changed and answers linked in the question use a mix of different versions.

The full settings.json (which can be opened by pressing Ctrl+, comma, searching for Color in the settings, and clicking one of the Edit in settings.json) is:

{
    "window.zoomLevel": 0,
    "workbench.colorTheme": "Atom One Light",
    "editor.tokenColorCustomizations": {
        "textMateRules": [{
            "scope": "meta.separator",
            "settings": {
                "foreground": "#9c9c9c",
                "fontStyle": "bold"
            }
        }],
    },
    "workbench.colorCustomizations": {
        "editorSuggestWidget.background": "#ccccccdd",
        "editorHoverWidget.background": "#ccccccdd"
    }
}

How to customize colours in vscodium?

1 Answers1