Programmatically detect light vs dark colour theme

Question

Is it possible programmatically to detect if the current theme is light or dark in VSCode?

Use Case:

I am developing a VSCode extension which is going to add Hovers to the editor, and I would like to have icons in the hovers. However, the background of the hover changes based on the current colour theme, so I need to choose the icons to display based on the colour theme.

Several other places in VSCode you are able to specify icons urls in the form:

let icon = {
    light: "uri for light icon",
    dark: "uri for dark icon",
};

so clearly VSCode has a notion of light vs dark themes.

This is similar to this question but AFAIK that answer only applies to webviews, and this issue is also brought up in this VSCode issue after it was closed

Answer 1

As of VS code 1.40, there is no API for this. Please file a feature request.

If you really, really want this info today though, you can read the current user's "workbench.colorTheme" setting and map this to dark/light. Instead of hardcoding this mapping, look it up by looping through the contributes of all known extensions using vscode.extensions.all.map(ext => ext.packageJSON). Here's an example theme contribution (the property you are interested in is uiTheme):

{
    ...
    "contributes": {
        "themes": [
            {
                "label": "Red",
                "uiTheme": "vs-dark",
                "path": "./themes/Red-color-theme.json"
            }
        ]
    }
}