Customize your VS Code/Code-OSS/VSCodium!!!
ABDULLAH AL AZMI
Posted on September 7, 2024
Installation Guide
Follow these steps to apply the settings to your VS Code, Code-OSS, or VSCodium:
1. Install Required Extensions
- Open VS Code/Code-OSS/VSCodium and navigate to the Extensions view by pressing
Ctrl + Shift + X
. - Search and install the following extensions:
- Ayu Theme: For the Ayu Dark theme.
- Material Icon Theme: For modern file and folder icons.
2. Open User Settings
- Open the Command Palette with
Ctrl + Shift + P
and typePreferences: Open User Settings (JSON)
. - This will open your settings file in JSON format.
3. Copy and Paste Settings
- Copy the provided settings configuration and paste it into the JSON file, replacing any existing settings.
4. Save the Settings
- Save the file by pressing
Ctrl + S
. The changes will be applied automatically.
5. Restart VS Code/Code-OSS/VSCodium
- Restart your editor to ensure all settings and themes are correctly applied.
Troubleshooting
- If the theme does not change, make sure the Ayu theme is correctly installed and selected in the settings via
File > Preferences > Color Theme
. - Ensure all extensions are up-to-date to avoid compatibility issues.
JSON File
Workbench Settings
{
"workbench.colorTheme": "Ayu Dark",
"workbench.iconTheme": "material-icon-theme",
"workbench.startupEditor": "none",
"workbench.tree.enableStickyScroll": false,
"editor.cursorBlinking": "smooth",
"editor.cursorSmoothCaretAnimation": "on",
"git.autofetch": true,
"tabnine.experimentalAutoImports": true,
"workbench.activityBar.location": "top",
"editor.language.colorizedBracketPairs": [],
"workbench.preferredHighContrastColorTheme": "Ayu Dark Bordered",
"workbench.preferredHighContrastLightColorTheme": "Ayu Light",
"workbench.preferredLightColorTheme": "Ayu",
"window.menuBarVisibility": "toggle",
"workbench.editor.centeredLayoutFixedWidth": true,
"editor.fontWeight": "500",
"editor.fontVariations": false,
"editor.tokenColorCustomizations": {
"[Ayu Dark]": {}
},
"git.ignoreRebaseWarning": true,
"go.toolsManagement.autoUpdate": true
}
Terminal Settings
{
"terminal.integrated.cursorBlinking": true,
"terminal.integrated.cursorStyle": "line",
"terminal.integrated.smoothScrolling": true,
"terminal.integrated.cursorStyleInactive": "none",
"terminal.integrated.fontFamily": "monospace",
"terminal.integrated.fontWeight": "normal",
"terminal.integrated.lineHeight": 1.1,
"terminal.integrated.gpuAcceleration": "auto",
"terminal.integrated.scrollback": 1000,
"terminal.integrated.focusAfterRun": "terminal",
"terminal.integrated.tabs.defaultColor": "terminal.ansiBlack",
"terminal.integrated.tabs.title": "${sequence}",
// ----------------------------------------------
// Custom Colors and Theming
// ----------------------------------------------
"workbench.colorCustomizations": {
"[Ayu Dark]": {
"terminal.foreground": "#E6E1CF",
"terminalCursor.foreground": "#FFA500",
"terminalCursor.background": "#E6E1CF",
"terminal.ansiBlack": "#3C3F58",
"terminal.ansiBlue": "#39BAE6",
"terminal.ansiCyan": "#95E6CB",
"terminal.ansiGreen": "#a7ca71",
"terminal.ansiMagenta": "#C792EA",
"terminal.ansiRed": "#F07178",
"terminal.ansiWhite": "#F8F8F2",
"terminal.ansiYellow": "#FFCB6B",
"terminal.ansiBrightBlack": "#5A5A76",
"terminal.ansiBrightBlue": "#39BAE6",
"terminal.ansiBrightCyan": "#95E6CB",
"terminal.ansiBrightGreen": "#C3E88D",
"terminal.ansiBrightMagenta": "#C792EA",
"terminal.ansiBrightRed": "#F07178",
"terminal.ansiBrightWhite": "#F8F8F2",
"terminal.ansiBrightYellow": "#FFCB6B",
"editorCursor.foreground": "#FF8C00",
"editorCursor.background": "#E6E1CF"
},
"terminal.background": "#00000000"
},
"terminal.integrated.confirmOnKill": "editor",
💖 💪 🙅 🚩
ABDULLAH AL AZMI
Posted on September 7, 2024
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.