Posts Tagged ‘customisation’

Change background colour in vscode

March 14th, 2020

It should be easy, and is, but the information is hard to find.

Go to Settings (ctrl-,), search for “color customizations”, select “Edit in settings.json”.

A file like this is opened.


1
2
3
4
5
6
7
8
9
10
11
{
    "editor.minimap.enabled": false,
    "editor.fontFamily": "Selfelected1337 Regular", Consolas, "Courier New", monospace,
    "window.zoomLevel": 0,
    "editor.lineNumbers": "off",
    "typescript.updateImportsOnFileMove.enabled": "always",
    "editor.unfoldOnClickAfterEndOfLine": true,
    "editor.columnSelection": false,
    "workbench.colorTheme": "Tomorrow Night Blue",
    "workbench.preferredDarkColorTheme": "Default Light+",
}

(yupp, that’s my own font, Selfelected1337)

Add your setting.


1
2
3
4
5
6
7
8
{
    ...
    "workbench.preferredDarkColorTheme": "Default Light+",

    "workbench.colorCustomizations": {
        "editor.background": "#005ccc"
    }
}

If found the answer github repo which led to official docs.
How to change other colours still eludes me.

Update

I have found documentation for all? colours and now my theme overide is:


1
2
3
4
5
"workbench.colorCustomizations": {
    "editor.background": "#005ccc",
    "sideBar.background": "#0073ff",
    "activityBar.background": "#1a81ff",
},

Update

With later version (20210517) there is a built-in GUI for this. Just press

1
ctrl-,