logo
WorkBlogsProjects

Setup

Complete guide to setting up VS Code with my preferred configuration, extensions, and fonts.

Step 1

Download necessary files

Fira-code.zip

Unzip the font's file

Select all the fonts, right click, and click to Install

vsc-extensions.txt

Place this file in downloads

Open the vscode in downloads directory

Install VSC Export & Import extension in vs code.

Step 2

Installing all the extensions

Open Command Palette by pressing the keyboard shortcut

Cmd + ⇧ + P (Mac) / Ctrl + ⇧ + P (Windows)

Enter the text in prompt and press Enter ⏎

VSC Export & Import

All extension will start to install

Step 3

VS Code Settings

Open Command Palette by pressing the keyboard shortcut

Cmd + ⇧ + P (Mac) / Ctrl + ⇧ + P (Windows)

Enter the text in prompt and press Enter ⏎

Preferences: Open Settings (JSON)

Copy the settings.json from the below window

settings.json

settings.json
{
  "workbench.iconTheme": "material-icon-theme",
  "editor.fontFamily": "Fira Code",
  "editor.fontSize": 16,
  "window.nativeTabs": true,
  "editor.formatOnSave": true,
  "material-icon-theme.hidesExplorerArrows": true,
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "terminal.integrated.fontFamily": "MesloLGS NF",
  "files.autoSave": "afterDelay",
  "cursor.cpp.disabledLanguages": ["plaintext", "markdown", "scminput"],
  "workbench.colorTheme": "Ayu Dark",
  "workbench.colorCustomizations": {
    "sideBar.foreground": "#f3f3f0",
    "explorer.fileLabel.foreground": "#ABB2BF",
    "explorer.folderLabel.foreground": "#56B6C2"
  },
  "editor.tokenColorCustomizations": {
    "textMateRules": [
      {
        "scope": "comment",
        "settings": {
          "fontStyle": "italic"
        }
      }
    ]
  },
  "editor.cursorBlinking": "expand",
  "editor.cursorSmoothCaretAnimation": "on",
  "editor.wordWrap": "on",
  "editor.fontLigatures": true,
  "explorer.compactFolders": false,
  "editor.multiCursorModifier": "ctrlCmd",
  "redhat.telemetry.enabled": true,
  "[ignore]": {
    "editor.defaultFormatter": "foxundermoon.shell-format"
  },
  "[dotenv]": {
    "editor.defaultFormatter": "foxundermoon.shell-format"
  },
  "[dockerfile]": {
    "editor.defaultFormatter": "ms-azuretools.vscode-containers"
  },
  "[python]": {
    "editor.defaultFormatter": "ms-python.autopep8"
  }
}
Final

Complete Setup

Paste the code in the settings.json file in VS Code

Save the settings.json file

Cmd + S (Mac) / Ctrl + S (Windows)and restart VS Code
Done!🚀

Design & Developed by Asim
© 2025. All rights reserved.