VS Code Zen Mode: A Minimalist Configuration
VS Code Zen Mode
While Neovim is my go-to for quick edits and terminal-heavy workflows, VS Code remains indispensable for complex projects and debugging. However, out of the box, VS Code can feel cluttered. My configuration strips away the noise to create a "Zen" coding environment.
The Visual Aesthetic
To achieve a cohesive look with my system (Hyprland) and Neovim, I use the GitHub Dark Default theme. But I didn't stop there, I aggressively hid UI elements to focus purely on the code.
Settings Breakdown
In my settings.json, you'll see I've disabled almost every non-essential visual element:
// settings.json
{
"workbench.colorTheme": "GitHub Dark Default",
"workbench.iconTheme": "symbols",
"workbench.productIconTheme": "fluent-icons",
"editor.fontFamily": "'JetBrainsMono Nerd Font'",
"editor.fontSize": 16,
// Hiding the clutter
"workbench.activityBar.location": "hidden",
"editor.minimap.enabled": false,
"editor.scrollbar.horizontal": "hidden",
"editor.scrollbar.vertical": "hidden",
"workbench.editor.showTabs": "single",
"window.menuBarVisibility": "toggle",
"window.titleBarStyle": "native"
}
This setup removes the activity bar, scrollbars, and minimap, forcing you to rely on keyboard navigation, just like in Vim.
The Secret Sauce: Custom CSS
To take customization further, I use the Custom CSS and JS Loader extension. This allows me to inject a Style.css file that fine-tunes the UI beyond what standard settings allow.
"vscode_custom_css.imports": [
"file:///home/abdeldjalile-lafkir/.config/vscode-costume-settings/Style.css"
]
Workflow & Keybindings
Since the UI is hidden, efficient keybindings are critical. I've customized keybindings.json to keep my hands on the keyboard.
- Terminal Toggling:
Ctrl + ;(No need to click the bottom panel) - Settings:
Ctrl + ' - Copilot Chat:
Ctrl + i(Instant access to AI assistance) - Activity Bar:
Ctrl + q(Toggle visibility only when needed) - Split Navigation:
Ctrl + Shift + J/K(Mimicking Vim's HJKL directionality)
Language Specifics
I rely on specific formatters to keep code clean automatically ("editor.formatOnSave": true):
- Python: Uses the Black formatter with a line length of 120.
- LaTeX: I use LaTeX Workshop configured with
xelatexfor high-quality PDF output, auto-building on save. - C++: Standard
cpptoolsintegration.
Conclusion
By hiding the activity bar and relying on command palettes and shortcuts, VS Code feels much faster and lighter. It serves as the perfect GUI counterpart to my terminal-based Neovim setup.
Check out the full configuration in my dotfiles.