Customization and Tips
Last updated on 2026-08-24 | Edit this page
Estimated time: 15 minutes
Overview
Questions
- How do I customize VS Code’s appearance and keyboard shortcuts?
- What workspace settings help HPC development?
- How do I sync settings across machines?
Objectives
- Customize color themes, icons, and keyboard shortcuts
- Create workspace settings for HPC projects
- Use Settings Sync to keep configurations consistent
- Apply recommended settings for productive HPC work
Color Themes
- Press Ctrl+K Ctrl+T (or File > Preferences > Color Theme)
- Preview themes by arrowing through the list
- Press Enter to select
Popular themes for long coding sessions: Dark Modern (default), Dracula, Nord, One Dark Pro.
Install additional themes from the Extensions marketplace by searching “theme.”
File Icon Themes
File > Preferences > File Icon Theme. Icons help identify file types at a glance in the Explorer sidebar.
Keyboard Shortcuts
View and customize shortcuts at Ctrl+K Ctrl+S (or File > Preferences > Keyboard Shortcuts).
To change a shortcut:
- Search for the command
- Click the pencil icon
- Press your desired key combination
- VS Code saves it immediately
Workspace Settings
Create project-specific settings that override global defaults:
- In your project folder, create
.vscode/settings.json - Add settings:
JSON
{
"editor.formatOnSave": true,
"editor.autoSave": "afterDelay",
"editor.autoSaveDelay": 2000,
"files.trimTrailingWhitespace": true,
"files.insertFinalNewline": true,
"[python]": {
"editor.defaultFormatter": "ms-python.python",
"editor.formatOnSave": true
},
"terminal.integrated.scrollback": 5000
}
These settings apply only in this workspace and can be version-controlled with your project.
Settings Sync
Sync your VS Code configuration across multiple computers:
- Click the account icon in the bottom-left
- Sign in with Microsoft or GitHub account
- VS Code syncs extensions, settings, keybindings, and themes
Recommended Settings for HPC
Productivity Tips
- Keep the terminal visible: Resize editor so the terminal always shows
-
Use descriptive job names:
#SBATCH --job-name=analysis_v2 -
Redirect output:
2>&1 | tee output.logsaves and displays output -
Check resources: Run
sinfoto see available nodes and partitions -
Use file watchers carefully: Large remote
directories can slow VS Code; exclude
node_modules,.git, and large data directories in settings
Additional Extensions Worth Exploring
- Better Comments: Highlight TODO, HACK, BUG comments in code
- Bracket Pair Colorizer: Color-code nested brackets
- Path Intellisense: Auto-complete file paths
- Live Share: Collaborative real-time coding
Challenge: Personalize Your VS Code
- Open Command Palette (Ctrl+Shift+P) and type “Color Theme”
- Try three themes and pick your favorite
- Open Keyboard Shortcuts (Ctrl+K Ctrl+S)
- Search “Go to Line” and note (or customize) its shortcut
- Create
.vscode/settings.jsonin your project folder with at leastformatOnSaveandtrimTrailingWhitespaceenabled
After selecting a theme via Ctrl+Shift+P > “Color Theme,” the
change takes effect immediately. “Go to Line” defaults to Ctrl+G.
Creating .vscode/settings.json with
"editor.formatOnSave": true means your code auto-formats on
every save. Changes take effect immediately without restart.
If Settings Sync is enabled, these preferences carry to other machines automatically.
- Customize themes with Ctrl+K Ctrl+T; customize shortcuts with Ctrl+K Ctrl+S
- Workspace settings in
.vscode/settings.jsonapply per-project and can be version-controlled - Settings Sync keeps your VS Code identical across multiple machines
- Recommended HPC settings include format-on-save, trailing whitespace trimming, and increased terminal scrollback