Customize Visual Studio Code

[Liam]

Quick tutorial on how to customise your VS Code.
Note: Requires VS Code version 1.12 or higher.

So, in VS Code you can edit your preferences just like you can in many other text editors e.g sublime.

to do this you need to head to File > Preferences > Settings
Now you want to edit settings.json
Reminder themes are done in JSON and i have provided a base for getting started.

You can also edit commonly used items like font, font size, toggle auto save and much more.

Spoiler: My example

{
"workbench.colorCustomizations": {
"activityBar.background": "#009080",
"activityBarBadge.background": "#908000",
"editorLink.activeForeground": "#908000",
"editor.background": "#322323",
"editorCursor.foreground": "#009080",
"button.background": "#009080",
"button.hoverBackground": "#107060",
"dropdown.background": "#232323",
"dropdown.border": "#000000",
"input.background": "#232323",
"input.border": "#000000",
"scrollbar.shadow": "#900000",
"scrollbarSlider.activeBackground": "#009080",
"scrollbarSlider.hoverBackground": "#007060",
"statusBar.background": "#322323",
"statusBar.debuggingBackground": "#232323",
"statusBarItem.activeBackground": "#009080",
"statusBarItem.hoverBackground": "#007060",
"sideBarTitle.foreground": "#909090",
"sideBar.background": "#322323",
"sideBarSectionHeader.background": "#322323",
"debugToolBar.background": "#322323",
"list.activeSelectionBackground": "#009090",
"list.hoverBackground": "#007060",
"editor.wordHighlightBackground": "#009080",
"editor.hoverHighlightBackground": "#009080",
"editor.selectionBackground": "#908000",
"titleBar.activeBackground": "#322323",
"titleBar.inactiveBackground": "#322323",
"panelTitle.activeBorder": "#000000",
"panel.background": "#322323",
"notification.background": "#322323",
"tab.activeBackground": "#322323",
"tab.inactiveBackground": "#322323",
}
}

 

[VerTical]

Cool