🌈 VSCode Workbench Color Customization

A cool thing that I have learned about VSCode Workspaces today is that you can make them different colours. Yes! This cute little feature I found really useful because I often find myself running few instances at the same time.

So this can be achieved in few steps:

• make sure you have Title Bar Style set to custom (hit Cmd + , to get to VSCode settings page and search for the word title)

• then switch to Workspace tab and edit the settings.json

• after you click on Edit in settings.json you will see the following

{
 "folders": [
  {
    "path": "path_to_your_project"
  }
 ],
 "settings": {}
}

and you need to paste the following configuration inside settings like this:

{
 "folders": [
  {
   "path": "path_to_your_project"
  }
 ],
 "settings": {
  "workbench.colorCustomizations":
   {
     "titleBar.activeForeground": "#color_of_your_choice",
     "titleBar.inactiveForeground": "#color_of_your_choice",
     "titleBar.activeBackground": "#color_of_your_choice",
     "titleBar.inactiveBackground": "#color_of_your_choice",
   }
  }
}

That’s how my main workspace looks now

😎