No description
Find a file
Mattia Astorino 4c851ea50e
fix: Fix ts icon color
Close #172
2018-04-25 09:58:39 +02:00
.github unlock files 2018-04-20 20:07:36 +02:00
.gulp unlock files 2018-04-20 20:07:36 +02:00
.vscode unlock files 2018-04-20 20:07:36 +02:00
assets unlock files 2018-04-20 20:07:36 +02:00
extensions chore: things 2018-04-24 22:11:23 +02:00
src fix: Fix ts icon color 2018-04-25 09:58:39 +02:00
test feat: A lot of new file icons and some old icons fixed 2018-04-22 22:17:24 +02:00
typings unlock files 2018-04-20 20:07:36 +02:00
.babelrc unlock files 2018-04-20 20:07:36 +02:00
.eslintrc unlock files 2018-04-20 20:07:36 +02:00
.gitignore chore: Update gitignore 2018-04-20 21:31:15 +02:00
.npmrc unlock files 2018-04-20 20:07:36 +02:00
.vscodeignore unlock files 2018-04-20 20:07:36 +02:00
.yarnrc unlock files 2018-04-20 20:07:36 +02:00
CHANGELOG.md chore(release): 2.0.1 2018-04-23 23:47:19 +02:00
CODE_OF_CONDUCT.md unlock files 2018-04-20 20:07:36 +02:00
CONTRIBUTING.md unlock files 2018-04-20 20:07:36 +02:00
gulpfile.babel.ts unlock files 2018-04-20 20:07:36 +02:00
iconlist.json unlock files 2018-04-20 20:07:36 +02:00
LICENSE unlock files 2018-04-20 20:07:36 +02:00
logo.png chore: Update logo 2018-04-22 23:00:29 +02:00
package-lock.json chore(release): 2.0.1 2018-04-23 23:47:19 +02:00
package.json chore(release): 2.0.1 2018-04-23 23:47:19 +02:00
README.md chore: Update README 2018-04-25 09:50:31 +02:00
tsconfig.json unlock files 2018-04-20 20:07:36 +02:00
yarn.lock chore(yarn.lock): added yarn.lock 2018-04-21 18:22:47 +02:00

Twitter GitHub tag

The most epic theme meets Visual Studio Code. You can help by reporting issues here

Getting started

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

Installation

Launch Quick Open

Paste the following command and press Enter:

ext install vsc-material-theme

Packaged VSIX Extension

Download the latest .vsix release file from the GitHub repository 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,

Type theme and choose Preferences: Color Theme, then select one of the Material Theme variant from the list. After the activation the theme will set the correct icons theme for you, based on your picked theme variant.

Fix File Icons

If you notice that the folder icons does not match the material theme active variant you can fix it with just a command.

Launch Quick Open,

type material theme and select Material Theme: Settings from the drop-down menu. Here you will find the Fix file icons command that will set the correct icons theme based on your active material theme variant.

Set the accent color

Launch Quick Open,

Type Material Theme and choose Material Theme: Settings, then select Change 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"
                }
            }
        ]
    },
},

UI Overrides

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

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
}

Official Portings

Thanks to the Material Theme community you can use is with other softwares, here the official portings:

Other resources

  • AppIcon: Download the official Material Theme app icon for Visual Studio code

Contributors

This project exists thanks to all the people who contribute. [Contribute].

Backers

Thank you to all our backers! 🙏 [Become a backer]

Sponsors

Support this project by becoming a sponsor. Your logo will show up here with a link to your website. [Become a sponsor]


Copyright © 2017 Mattia Astorino