GrayJack Themes

My collection of themes based on classic/famous themes.

For now only themes based on Ariake, Monokai, Nord, OneDark and Tokyo Night

Monokai GrayJack

Monokai GrayJack (Pastel)

Monokai GrayJack (Solarized)

OneDark GrayJack

Ariake GrayJack

Tokyo Night GrayJack

Nord GrayJack

Customization

Didn't like something the way I did? You can easily change the configuration in your JSON configuration file

Workbench example

"workbench.colorCustomizations": {
    "[Monokai GrayJack]": {
        "sideBar.background": "#347890"
    },
    "[Monokai GrayJack (Pastel)]": {
        "sideBar.background": "#347890"
    }
}

You can find a list of all thing you can change in the workbench here

TextMate Scope Color and Styling

"editor.tokenColorCustomizations": {
    // simple example
    "[Monokai GrayJack]": {
        "comments": "#229977"
    },

    "[Monokai GrayJack (Pastel)]": {
        "textMateRules": [
            {
                "scope": "support.type.property-name.json",
                "settings": {
                    "foreground": "#229977",
                    "fontStyle": "italic"
                }
            }
        ]
    }
},

Semantic Tokens Color and Styling

"editor.semanticTokenColorCustomizations": {
    "[Monokai Grayjack]": {
        "enabled": true,
        "rules": {
            "comment": {
                "foreground": "#229977",
                "bold": true
            },
            // For a specific language
            "comment:java": {
                "foreground": "#229977",
                "bold": false
            }
        }
    }
},

The rules follow the pattern: <token>[.<modifier>][:<language-id>] where what is between angle bracket is mandatory and what is between square brackets are optional

You can find the Semantic Tokens and for TextMate Scope of a part of your code with the VS Code command Developer: Inspect Editor Tokens and Scopes.

For more about theme customization: https://code.visualstudio.com/docs/getstarted/themes

More on TextMate Scopes Highlight: https://code.visualstudio.com/api/extension-guides/color-theme

More on Semantic Highlight: https://code.visualstudio.com/api/language-extensions/semantic-highlight-guide