Vsc-legacy-material-theme NPM

Legacy Material Themes for Visual Studio Code

This repository is a fork of and contains the legacy visual studio code Material themes originally from https://github.com/material-theme/vsc-material-theme.

The only changes made are to this readme and package.json to remove the new theme options when selecting a theme in vscode, along with changes necessary to publish this package to the visual studio marketplace.

Getting started

You can install this awesome theme through the Visual Studio Code Marketplace.

Installation

Launch Quick Open:

Linux Ctrl+P
macOS ⌘P
Windows Ctrl+P

Paste the following command and press Enter:

ext install material theme

And pick the one by Mattia Astorino as author.

Packaged VSIX Extension

Download the latest .vsix release file from the marketplace and install it from the command line

code --install-extension vsc-material-theme-*.*.*.vsix

or from within VS Code by launching Quick Open and running the Install from VSIX... command.

GitHub Repository Clone

Change to your .vscode/extensions VS Code extensions directory. Depending on your platform it is located in the following folders:

Linux ~/.vscode/extensions
macOs ~/.vscode/extensions
Windows %USERPROFILE%\.vscode\extensions

Clone the Material Theme repository as Equinusocio.vsc-material-theme:

git clone https://github.com/equinusocio/vsc-material-theme.git Equinusocio.vsc-material-theme

Activate theme

Launch Quick Open:

Linux Ctrl + Shift + P
macOS ⌘ + Shift + P
Windows Ctrl + Shift + P

Type theme, choose Preferences: Color Theme, and select one of the Material Theme variants from the list. After activation, the theme will set the correct icon theme based on your active theme variant.

Set the accent color

Launch Quick Open:

Linux Ctrl + Shift + P
macOS ⌘ + Shift + P
Windows Ctrl + Shift + P

Type material theme, choose Material Theme: Set accent color, and pick one color from the list.

Override theme colors

You can override the Material Theme UI and schemes colors by adding these theme-specific settings to your configuration. For advanced customisation please check the relative section on the VS Code documentation.

Color Scheme override

Basic example

"editor.tokenColorCustomizations": {
    "[Material Theme]": {
        "comments": "#229977"
    }
},

Advanced example

"editor.tokenColorCustomizations": {
    "[Material Theme VARIANT]": {
        "textMateRules": [
            {
                "scope": [
                    "punctuation.definition.comment",
                    "comment.block",
                    "comment.line",
                    "comment.block.documentation"
                ],
                "settings": {
                    "foreground": "#FF0000"
                }
            }
        ]
    },
},

"workbench.colorCustomizations": {
	"[Material Theme VARIANT]": {
		"sideBar.background": "#ff0000",
	}
},

Recommended settings for a better experience

{
    // Controls the font family.
    "editor.fontFamily": "Operator Mono",
    // Controls the line height. Use 0 to compute the lineHeight from the fontSize.
    "editor.lineHeight": 24,
    // Enables font ligatures
    "editor.fontLigatures": true,
    // Controls if file decorations should use badges.
    "explorer.decorations.badges": false
}