Tip: VS Code workspace highlight

Part of my tips series, which aim to help boost your productivity.

Simple tip this one, but it really helps in preventing yourself getting lost when multiple projects are open concurrently.

Steps

  1. In your project root create a folder called .vscode.
  2. Inside that folder create a settings.json file.
  3. Inside that file add the following, and obviously change the hex values to ones related to your project:
{
  "workbench.colorCustomizations": {
    "titleBar.activeForeground": "#000",
    "titleBar.inactiveForeground": "#000000CC",
    "titleBar.activeBackground": "#54C7FC",
    "titleBar.inactiveBackground": "#327DA0"
}

Which will then customise the project's title bar colour. I've obviously chosen the blue related to my brand here.

VS Code - Highlight example - single.

This makes it instantly obvious which project is active, without having to focus on reading the title.

VS Code - Highlight example - expose.

It also helps you quickly select your primary project when tabbing through windows, or the example above, inside macOS's exposé mode.

I hope you found that useful.

If you have any simple productivity tips similar to this, please let me know the comments :)

Comments