> For the complete documentation index, see [llms.txt](https://sandeepamaranath.gitbook.io/notes/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://sandeepamaranath.gitbook.io/notes/editor/vscode.md).

# VsCode

## Fonts

### Italics

To get the style of the below text, change it in settings.json (settings.json code below)

![Sample code for below settings](/files/-MaCA3XLm4sIfq9jloO4)

If you want to change this from italic to normal then change textMateRules font-style to italic.

{% code title="settings.json" %}

```javascript
{
  "editor.suggestSelection": "first",
  "vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue",
  "workbench.iconTheme": "Monokai Pro (Filter Spectrum) Icons",
  "files.exclude": {
    "**/.classpath": true,
    "**/.project": true,
    "**/.settings": true,
    "**/.factorypath": true
  },
  "javascript.updateImportsOnFileMove.enabled": "always",
  "explorer.confirmDragAndDrop": false,
  "workbench.startupEditor": "newUntitledFile",
  "prettier.arrowParens": "always",
  "terminal.integrated.fontSize": 15,
  "terminal.integrated.letterSpacing": 1,
  "terminal.integrated.lineHeight": 2,
  "git.autofetch": true,
  "git.suggestSmartCommit": false,
  "emmet.includeLanguages": {
    "javascript": "javascriptreact"
  },
  "diffEditor.ignoreTrimWhitespace": false,
  "[javascriptreact]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[javascript]": {
    "editor.defaultFormatter": "vscode.typescript-language-features"
  },
  "workbench.colorTheme": "Dark++ Italic",
  "editor.formatOnSave": true,
  "editor.letterSpacing": 0.5,
  "editor.defaultFormatter": "esbenp.prettier-vscode",

  "workbench.colorCustomizations": {
    "activityBar.background": "#0e0b0b",
    "editor.background": "#000",
    "sideBar.background": "#0c0b0b",
    "sideBar.foreground": "#fff"
  },
  "editor.tokenColorCustomizations": {
    // "textMateRules": [
    //   {
    //     "scope": "comment",
    //     "settings": {
    //       "fontStyle": "italic"
    //     }
    //   }
    // ],
    "comments": "#a7a4ac",
    "strings": "#fdce12",
    // "strings": "#f6c70e",
    // "strings": "#7ed07e",
    "keywords": "#f39c12",
    "numbers": "#dda0dd",
    "types": "#f2ca27",
    // "functions": "#08b8cf",
    "functions": "#7ed07e",
    // "functions": "#7ed07e",
    // "variables": "#08b8cf",
    // "variables": "#7ed07e"
    "textMateRules": [
      {
        "scope": [
          "constant",
          "comment",
          "variable",
          "number",
          "type",
          "meta.function",
          "meta.function-call", //function call
          "entity.name.type.class", //class names
          "keyword", //import, export, return…
          "storage.modifier", //static keyword
          "storage.type", //class keyword
          "support.class.builtin",
          "keyword.control",
          "constant.language",
          "entity.other.attribute-name",
          "string.quoted.single",
          "entity.name.method",
          "entity.name.tag"
        ], // array of Scopes to which the style should be applied to
        "settings": {
          "fontStyle": "italic" // the font style that should be applied
        }
      },
      {
        "scope": "punctuation",
        "settings": {
          "foreground": "#ffffff"
        }
      }
    ]
    // --syntax-background-color: #08090a;
    // --syntax-text-color: #f8f8f2;
    // --syntax-comment-color: #808080;
    // --syntax-declaration-color: #f39c12;
    // --syntax-literal-color: #dda0dd;
    // --syntax-error-color: #f9690e;
    // --syntax-name-color: #7ed07e;
    // --syntax-string-color: #f2ca27;
  },

  // I added this section

  "editor.accessibilityPageSize": 9,
  "editor.fontLigatures": true,

  "liveSassCompile.settings.formats": [
    {
      "format": "expanded",
      "extensionName": ".css",
      "savePath": "/dist/css"
    }
  ],
  "leetcode.workspaceFolder": "/Users/sandeepamarnath/Coding/LeetCode/LeetCodeFromVsCode",
  "[json]": {
    "editor.quickSuggestions": {
      "strings": true
    },
    "editor.suggest.insertMode": "replace",
    "gitlens.codeLens.scopes": ["document"]
  },
  "editor.fontSize": 21,
  "editor.lineHeight": 33,
  "editor.fontFamily": "Fira Code iScript,Menlo, Monaco, 'Courier New', monospace"
  // "editor.renderIndentGuides": false
}

```

{% endcode %}

## To change Everything 

{% embed url="<https://www.youtube.com/watch?t=12s&v=mC_htrJ1QPg>" %}

## Customize VS-Code terminal

{% embed url="<https://github.com/ohmyzsh/ohmyzsh/wiki/Themes>" %}
themes of terminal
{% endembed %}

THIS IS THE ONLY VIDEO YOU NEED, I PROMISE!

{% embed url="<https://www.youtube.com/watch?v=su0h5StEZ6A>" %}

{% embed url="<https://medium.com/@shivam1/make-your-terminal-beautiful-and-fast-with-zsh-shell-and-powerlevel10k-6484461c6efb>" %}

Run this - `sh -c "$(curl -fsSL https://raw.githubusercontent.com/robbyrussell/oh-my-zsh/master/tools/install.sh)"`

`vim ~/.zshrc`

`Run this command above and change it to the theme you want (choose themes from above link)`

![vim \~/.zshrc](/files/C9BycneVUK4WJAc30Glx)

Then do :`wq` to save and restart the terminal or open new terminal to see the changes and you're good.&#x20;

## Themes

### Winter is coming theme customized

```json
{
  "editor.accessibilitySupport": "off",
  "workbench.iconTheme": "file-icons",

  /* MY CUSTOMIZATION */
  "workbench.colorCustomizations": {
    // Default dark theme
    "[Default Dark+]": {
      "editor.background": "#000",
      "editor.lineHighlightBorder": "#0a0a0b"
    },

    // Winter is Coming (Dark Blue)
    "[Winter is Coming (Dark Blue - No Italics)]": {
      "editor.lineHighlightBorder": "#fefefe00",
      "editor.lineHighlightBackground": "#fafafa07"
    }
  },

  "editor.tokenColorCustomizations": {
    // Default dark theme
    "[Default Dark+]": {
      "functions": "#9299eb",
      "comments": "#74736e",
      "variables": "#52615d"
    },

    // Winter is Coming (Dark Blue)
    "[Winter is Coming (Dark Blue - No Italics)]": {
      "textMateRules": [
        {
          "scope": [
            "string.quoted.single",
            "string.quoted.double",
            "string.template.js"
          ],
          "settings": {
            "foreground": "#93faf9"
          }
        },
        {
          "scope": "comment.line.double-slash.js",
          "settings": {
            "foreground": "#a5a0a0"
          }
        },
        {
          "scope": "variable.other.object.js",
          "settings": {
            "foreground": "#65eeec"
          }
        },
        {
          "scope": ["variable.other.readwrite.js"],
          "settings": {
            "foreground": "#d3a7ee"
          }
        },
        {
          // keys inside object
          "scope": ["meta.object-literal.key.js"],
          "settings": {
            "foreground": "#cafbff"
          }
        },
        {
          "scope": "constant.numeric.decimal.js",
          "settings": {
            "foreground": "#fdfffc"
          }
        },
        {
          "scope": [],
          "settings": {
            // "foreground": "#8ad2ff"
          }
        },
        {
          "scope": [
            "variable.other.constant.js",
            "meta.definition.variable.js",
            "meta.var-single-variable.expr.js"
          ],
          "settings": {
            "foreground": "#c3c5ff"
          }
        },
        {
          "scope": ["entity.name.function.js", "meta.function-call.js"],
          "settings": {
            "foreground": "#f4fccd"
          }
        },
        {
          "scope": [
            "punctuation.definition.template-expression.begin.js",
            "meta.template.expression.js"
          ],
          "settings": {
            "foreground": "#ffda5f"
          }
        }
      ]
    }
  },
  /* END OF MY CUSTOMIZATION */
  "workbench.colorTheme": "Winter is Coming (Dark Blue - No Italics)",
  "editor.lineHeight": 1.8,
  "terminal.integrated.fontFamily": "FuraMono Nerd Font",
  "editor.fontSize": 14,
  "editor.cursorBlinking": "expand",
  "editor.bracketPairColorization.enabled": true,
  "editor.guides.bracketPairs": "active",
  "gitlens.hovers.currentLine.over": "line",
  "gitlens.heatmap.locations": ["gutter", "overview"],
  "workbench.editorAssociations": {
    "git-rebase-todo": "gitlens.rebase"
  },
  "editor.wordWrap": "on",
  "editor.wordWrapColumn": 80,

  /* Prettier config*/
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "prettier.printWidth": 80,
  "prettier.semi": false,
  "editor.minimap.enabled": false,
  "prettier.singleQuote": true,
  "editor.formatOnSave": true,
  "window.zoomLevel": 1
}

```