Skip to content
| Marketplace
Sign in
Visual Studio Code>Themes>Graymium ThemeNew to Visual Studio Code? Get it now.
Graymium Theme

Graymium Theme

olegfedak

|
887 installs
| (0) | Free
More natural gray, syntax highlighting for web developers, coders and designers.
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Graymium Theme for VSCode

The dark gray theme for web development and designing by code. Syntax highlighting is provided for markup, styling and scripting. This theme is optimised to be minimalistic and easy on the eyes for long coding hours.

☝ In addition to colors, certain interface settings is also changed. See "configuration defaults" below.

Syntax highlighting

  • JSON, YAML
  • Markdown
  • HTML
  • CSS, SCSS
  • JavaScript, TypeScript
  • Liquid, Nunjucks
  • Vue

Install

Go to Marketplace and click on the "install" button or do it in VSCode:

  1. Go to View -> Extensions
  2. Search for Graymium Theme
  3. Click on Install

Configuration defaults

All Settings
{
   "workbench.colorTheme": "Graymium Theme",
   "workbench.editor.tabSizing": "fit",
   "workbench.iconTheme": null,
   "workbench.tree.indent": 14,
   "workbench.tree.renderIndentGuides": "none",
   "workbench.editor.decorations.colors": false,
   "explorer.compactFolders": false,
   "explorer.decorations.colors": false,
   "editor.autoIndent": "brackets",
   "editor.bracketPairColorization.enabled": false,
   "editor.linkedEditing": true,
   "editor.formatOnPaste": true,
   "editor.formatOnSave": true,
   "editor.formatOnType": false,
   "editor.fontFamily": "Menlo, SF Mono",
   "editor.fontSize": 12,
   "editor.lineHeight": 1.5,
   "editor.fontWeight": "500",
   "editor.cursorBlinking": "phase",
   "editor.cursorStyle": "line",
   "editor.guides.indentation": false,
   "editor.minimap.size": "fit",
   "editor.minimap.enabled": false,
   "terminal.integrated.lineHeight": 1.2,
   "terminal.integrated.shellIntegration.decorationsEnabled": "never",
   "files.trimTrailingWhitespace": true,
   "files.trimFinalNewlines": true,
   "files.associations": {
      "*.njk": "nunjucks",
      "*.liquid": "liquid"
   },
   "window.commandCenter": false,
   "workbench.layoutControl.enabled": false,
   "breadcrumbs.enabled": false,
   "scm.repositories.visible": 0,
   "scm.showActionButton": false,
   "scm.alwaysShowActions": false,
   "scm.diffDecorationsGutterVisibility": "hover",
   "explorer.confirmDragAndDrop": false,
   "explorer.incrementalNaming": "smart",
   "explorer.confirmDelete": false,
   "html.format.enable": true,
   "html.format.extraLiners": "body",
   "html.format.maxPreserveNewLines": 1,
   "[liquid]": {
      "editor.defaultFormatter": "vscode.html-language-features"
   },
   "css.format.spaceAroundSelectorSeparator": true,
   "scss.format.spaceAroundSelectorSeparator": true,
   "less.format.spaceAroundSelectorSeparator": true
}

Recommendations

  • Code fonts: Menlo (by default on MacOS), or SF Mono.

  • For Terminal prompts try Ash Theme (works in zsh using oh-my-zsh).

  • To make better use of Nunjucks syntax highlighting inside of Markdown, HTML etc. — try Better Nunjucks extension.

  • Working with Liquid try this Liquid VSCode extension. (Supports Formatting, Syntax Highlighting, Snippets, HTML IntelliSense and other essential features).

Feedback

If you have suggestions, please open an issue or better yet, a pull request.

Author

Oleg Fedak

License

This project is open source and available under the MIT License

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft