Instantly share code, notes, and snippets.
-
Star
10
(10)
You must be signed in to star a gist -
Fork
2
(2)
You must be signed in to fork a gist
-
-
Save iLiranS/a02c01a31176127a7e35c5ce170b8331 to your computer and use it in GitHub Desktop.
| { | |
| "explorer.confirmDelete": false, | |
| "terminal.integrated.fontWeight": "500", | |
| "terminal.integrated.letterSpacing": 1, | |
| "terminal.integrated.fontWeightBold": "900", | |
| "terminal.integrated.gpuAcceleration": "off", | |
| "editor.fontFamily": " 'Fira Code Retina' ,Consolas, 'Courier New', monospace", | |
| "editor.fontLigatures": true, | |
| "editor.fontWeight": "400", | |
| "liveServer.settings.donotShowInfoMsg": true, | |
| "security.workspace.trust.untrustedFiles": "open", | |
| "editor.roundedSelection": false, | |
| "workbench.startupEditor": "none", | |
| "javascript.updateImportsOnFileMove.enabled": "always", | |
| "css.lint.unknownAtRules": "ignore", | |
| "editor.accessibilitySupport": "off", | |
| "window.titleBarStyle": "custom", | |
| "inlineFold.maskChar": "•••", | |
| "inlineFold.maskColor": "#d7c268", | |
| "terminal.integrated.smoothScrolling": true, | |
| "editor.smoothScrolling": true, | |
| "editor.cursorBlinking": "expand", | |
| "bundleSize.infoColor": "#bfbfbf50", | |
| "editor.minimap.size": "fill", | |
| "inlineFold.unfoldedOpacity": 0.9, | |
| "inlineFold.unfoldOnLineSelect": true, | |
| "diffEditor.hideUnchangedRegions.enabled": true, | |
| "editor.minimap.enabled": false, | |
| "editor.formatOnSave": true, | |
| "turboConsoleLog.addSemicolonInTheEnd": true, | |
| "turboConsoleLog.includeFileNameAndLineNum": true, | |
| "turboConsoleLog.insertEmptyLineAfterLogMessage": true, | |
| "editor.linkedEditing": true, | |
| "editor.stickyScroll.enabled": false, | |
| "animations.Enabled": true, | |
| "window.autoDetectHighContrast": false, | |
| "animations.Scrolling": "None", | |
| "animations.Tabs": "Slide", | |
| "workbench.colorTheme": "One Dark Pro Monokai Darker", | |
| "workbench.preferredDarkColorTheme": "One Dark Pro Monokai Darker", | |
| "workbench.iconTheme": "symbols", | |
| "terminal.integrated.minimumContrastRatio": 1, | |
| "workbench.preferredLightColorTheme": "One Dark Pro Monokai Darker", | |
| "symbols.hidesExplorerArrows": false, | |
| "editor.lineHeight": 1.8, | |
| "editor.minimap.autohide": true, | |
| "editor.cursorSmoothCaretAnimation": "on", | |
| "window.commandCenter": false, | |
| "explorer.fileNesting.enabled": true, | |
| "explorer.fileNesting.patterns": { | |
| "*.ts": "${capture}.js", | |
| "*.js": "${capture}.js.map, ${capture}.min.js, ${capture}.d.ts", | |
| "*.jsx": "${capture}.js", | |
| "*.tsx": "${capture}.ts ${capture}.*.tsx", | |
| "tsconfig.json": "tsconfig.*.json", | |
| "package.json": "package-lock.json, yarn.lock, pnpm-lock.yaml, bun.lockb", | |
| "tailwind.config.*": "tailwind.config*, postcss.config*", | |
| ".env": ".env*" | |
| }, | |
| "window.confirmSaveUntitledWorkspace": false, | |
| "background.smoothImageRendering": true, | |
| "workbench.activityBar.location": "bottom", | |
| "editor.scrollbar.verticalScrollbarSize": 10, | |
| "editor.scrollbar.horizontalScrollbarSize": 10, | |
| "update.mode": "default", | |
| "explorer.confirmDragAndDrop": false, | |
| "gutterpreview.imagePreviewMaxHeight": 0, | |
| "gutterpreview.imagePreviewMaxWidth": 160, | |
| "background.useInvertedOpacity": true, | |
| "window.newWindowProfile": "Default", | |
| "extensions.ignoreRecommendations": true, | |
| "custom-ui-style.stylesheet": { | |
| // sidebar and general styling | |
| ".editor-actions": "opacity:0.5", | |
| ".title-label > h2": "display: none", | |
| ".monaco-list-row.selected, .monaco-list-row.focused": "box-shadow: inset 0 1px 0 #ffffff09 !important; outline:1px solid #00000020 !important;", | |
| ".monaco-workbench .monaco-list:not(.element-focused):focus:before": "display: none", | |
| ".line-numbers": "width: 36px !important;", | |
| ".current-line-margin-both": "background-color: #ffffff12 !important; width: calc(100% - 16px) !important; left:12px !important; border-radius: 4px;", | |
| ".quick-input-widget": "top: 50% !important; transform: translateY(-51%); backdrop-filter: blur(10px); border: 1px solid #ffffff12;", | |
| ".quick-input-widget .monaco-inputbox": "height: 32px !important; border-radius: 8px; margin-bottom: 4px;", | |
| ".quick-input-widget .monaco-list-rows": "background: transparent !important;", | |
| ".hover-widget": "backdrop-filter:blur(10px);", | |
| ".monaco-button": "border-radius: 4px; box-shadow: inset 0 1px 0 #ffffff09 !important;", | |
| ".notification-toast": "backdrop-filter:blur(10px); border: 1px solid #ffffff09 !important; border-radius: 8px !important; ", | |
| ".sidebar ul[role=tablist] .action-item": "width:32px;padding:0px !important; height:32px !important; display:flex !important; align-items:center; justify-content:center; border-radius:4px;", | |
| ".sidebar ul[role=tablist] .action-item.checked": "background-color: #ffffff12 !important; box-shadow:inset 0 1px 0 #ffffff09 !important; border-radius:6px;outline:1px solid #00000020 !important;", | |
| ".sidebar ul[role=tablist] .action-label:before": "left:auto !important;", | |
| ".sidebar ul[role=tablist] .active-item-indicator": "display:none !important;", | |
| ".find-widget": "border-radius:6px; backdrop-filter:blur(4px);", | |
| ".monaco-inputbox, .scm-editor": "border-radius:6px !important;", | |
| ".slider": "border-radius: 4px; backdrop-filter:blur(10px);", | |
| ".monaco-button-dropdown": "border-radius:6px !important;", | |
| ".context-view.monaco-menu-container": "border: 1px solid #ffffff09 !important; border-radius: 8px !important;", | |
| ".suggest-widget": "border-radius:6px !important; backdrop-filter:blur(10px); overflow:hidden; box-shadow:0 0 10px #00000030;", | |
| ".suggest-widget .monaco-row": "border-radius:0px !important;", | |
| ".monaco-hover": "backdrop-filter:blur(10px); border-radius:8px !important;", | |
| ".monaco-workbench .part.sidebar": "border: none !important;", | |
| // rounded corners and shadows for editors | |
| ".monaco-workbench .part.editor>.content .editor-group-container>.title .tabs-container>.tab": "border:none !important; background:#1c1c1c !important;", | |
| ".monaco-workbench .part.editor>.content .editor-group-container>.title .tabs-container>.tab.active": "border-radius: 0.5rem;background:#242424 !important;", | |
| ".editor-group-container": "border-radius: 0.5rem; overflow:hidden;", | |
| ".tabs-and-actions-container": "border-radius:0.5rem 0.5rem 0 0; background:#1c1c1c; padding:0.35rem;", | |
| ".editor-group-container .editor-container:has(.extension-editor)": "border-radius: 0.5rem;", | |
| ".monaco-workbench .part.editor>.content": "padding: 0 10px 10px 10px; position: relative; background:#242424 !important;", | |
| ".monaco-workbench .part.editor .monaco-scrollable-element > .scrollbar.vertical": "margin-right:24px", | |
| ".monaco-workbench .part.editor>.content .editor-group-container": "border-radius: 0.5rem; height: calc(100% - 10px); width:calc(100% - 20px); overflow: hidden;box-shadow:rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px", | |
| ".monaco-editor": "border-radius: 0 0 0.5rem 0.5rem; overflow: hidden;", | |
| ".monaco-editor-background": "border-radius: 0.5rem;", | |
| ".monaco-workbench .part.editor>.content .editor-group-container>.title .tabs-container>.tab.active.tab-border-top>.tab-border-top-container, .monaco-workbench .part.editor>.content .editor-group-container>.title .tabs-container>.tab.selected.tab-border-top>.tab-border-top-container": "height: 0", | |
| ".breadcrumbs-below-tabs": "overflow: hidden; background: #1c1c1c", | |
| ".monaco-breadcrumbs": "font-size: 0.7rem", | |
| ".monaco-editor .sticky-widget": "box-shadow: none; border-color: #2b2d30", | |
| ".monaco-editor .scroll-decoration": "box-shadow: none", | |
| ".monaco-workbench .part.editor>.content .editor-group-container.active>.title .tabs-container>.tab.active": "box-shadow:rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;", | |
| ".tabs-and-actions-container:has(.tab.active:first-child)": "box-shadow: -20px 5px 0 0 #1c1c1c; border-radius: 0.5rem 0.5rem 0 0;", | |
| ".monaco-split-view2.separator-border.vertical>.monaco-scrollable-element>.split-view-container>.split-view-view:not(:first-child):before": "background: #2b2d30 !important", | |
| ".monaco-split-view2.separator-border>.monaco-scrollable-element>.split-view-container>.split-view-view:not(:first-child):before": "background: #2b2d30 !important", | |
| ".monaco-workbench .part.titlebar>.titlebar-container>.titlebar-center>.window-title>.command-center .action-item.command-center-center": "border-radius: 0.5rem; border: none", | |
| ".titlebar-center, .titlebar-right": "opacity: 0; transition: all 0.15s", | |
| ".titlebar-center:hover, .titlebar-right:hover": "opacity: 1; pointer-events: all", | |
| "li.action-item.icon.checked, li.action-item.icon:hover": "opacity: 1", | |
| "li.action-item.icon": "transition: all 0.15s; opacity: 0.2", | |
| ".monaco-workbench .pane-composite-part>.header-or-footer>.composite-bar-container>.composite-bar>.monaco-action-bar .action-item.checked .active-item-indicator:before, .monaco-workbench .pane-composite-part>.header-or-footer>.composite-bar-container>.composite-bar>.monaco-action-bar .action-item:focus .active-item-indicator:before, .monaco-workbench .pane-composite-part>.title>.composite-bar-container>.composite-bar>.monaco-action-bar .action-item.checked .active-item-indicator:before, .monaco-workbench .pane-composite-part>.title>.composite-bar-container>.composite-bar>.monaco-action-bar .action-item:focus .active-item-indicator:before": "border-top-width:1px", | |
| // terminal related | |
| ".part.panel .composite-bar-container .actions-container .action-item:not(.checked) a": "color:rgb(120,120,120) !important", | |
| ".monaco-workbench .part.panel": "background:#1c1c1c !important; margin:0 10px 0 10px; height:calc(100% - 10px); border-radius:0.5rem; display:flex; flex-direction:column; box-shadow:rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px", | |
| // secondary sidebar | |
| ".monaco-workbench .part.auxiliarybar": "margin: 0 0 0 10px !important; border-radius: 0.5rem; height:calc(100% - 10px); display:flex; flex-direction:column;", | |
| // 3 dots menu shifting and bottom panel spacing | |
| "#workbench\\.parts\\.sidebar > div.composite.has-composite-bar.header-or-footer.footer > div > div": "width:100%", | |
| "#workbench\\.parts\\.sidebar > div.composite.has-composite-bar.header-or-footer.footer > div > div > div > ul": "justify-content:space-evenly", | |
| "#workbench\\.parts\\.sidebar > div.composite.title": "position:absolute; right:0; bottom:35px;", | |
| "#workbench\\.parts\\.sidebar": "height:100%;", | |
| "#workbench\\.parts\\.sidebar > div.composite.has-composite-bar.header-or-footer.footer": "transform:translateY(30px)", | |
| }, | |
| "custom-ui-style.stylesheet": { | |
| // sidebar and general styling | |
| ".editor-actions": "opacity:0.5", | |
| ".title-label > h2": "display: none", | |
| ".monaco-list-row.selected, .monaco-list-row.focused": "box-shadow: inset 0 1px 0 #ffffff09 !important; outline:1px solid #00000020 !important;", | |
| ".monaco-workbench .monaco-list:not(.element-focused):focus:before": "display: none", | |
| ".line-numbers": "width: 36px !important;", | |
| ".current-line-margin-both": "background-color: #ffffff12 !important; width: calc(100% - 16px) !important; left:12px !important; border-radius: 4px;", | |
| ".quick-input-widget": "top: 50% !important; transform: translateY(-51%); backdrop-filter: blur(10px); border: 1px solid #ffffff12;", | |
| ".quick-input-widget .monaco-inputbox": "height: 32px !important; border-radius: 8px; margin-bottom: 4px;", | |
| ".quick-input-widget .monaco-list-rows": "background: transparent !important;", | |
| ".hover-widget": "backdrop-filter:blur(10px);", | |
| ".monaco-button": "border-radius: 4px; box-shadow: inset 0 1px 0 #ffffff09 !important;", | |
| ".notification-toast": "backdrop-filter:blur(10px); border: 1px solid #ffffff09 !important; border-radius: 8px !important; ", | |
| ".sidebar ul[role=tablist] .action-item": "width:32px;padding:0px !important; height:32px !important; display:flex !important; align-items:center; justify-content:center; border-radius:4px;", | |
| ".sidebar ul[role=tablist] .action-item.checked": "background-color: #ffffff12 !important; box-shadow:inset 0 1px 0 #ffffff09 !important; border-radius:6px;outline:1px solid #00000020 !important;", | |
| ".sidebar ul[role=tablist] .action-label:before": "left:auto !important;", | |
| ".sidebar ul[role=tablist] .active-item-indicator": "display:none !important;", | |
| ".find-widget": "border-radius:6px; backdrop-filter:blur(4px);", | |
| ".monaco-inputbox, .scm-editor": "border-radius:6px !important;", | |
| ".slider": "border-radius: 4px; backdrop-filter:blur(10px);", | |
| ".monaco-button-dropdown": "border-radius:6px !important;", | |
| ".context-view.monaco-menu-container": "border: 1px solid #ffffff09 !important; border-radius: 8px !important;", | |
| ".suggest-widget": "border-radius:6px !important; backdrop-filter:blur(10px); overflow:hidden; box-shadow:0 0 10px #00000030;", | |
| ".suggest-widget .monaco-row": "border-radius:0px !important;", | |
| ".monaco-hover": "backdrop-filter:blur(10px); border-radius:8px !important;", | |
| ".monaco-workbench .part.sidebar": "border: none !important;", | |
| // rounded corners and shadows for editors | |
| ".monaco-workbench .part.editor>.content .editor-group-container>.title .tabs-container>.tab": "border:none !important; background:#1c1c1c !important;", | |
| ".monaco-workbench .part.editor>.content .editor-group-container>.title .tabs-container>.tab.active": "border-radius: 0.5rem;background:#242424 !important;", | |
| ".editor-group-container": "border-radius: 0.5rem; overflow:hidden;", | |
| ".tabs-and-actions-container": "border-radius:0.5rem 0.5rem 0 0; background:#1c1c1c;", | |
| ".tabs-and-actions-container .monaco-scrollable-element .tabs-container >*": "scale:0.95; margin:2px 0px;", | |
| ".editor-group-container .editor-container:has(.extension-editor)": "border-radius: 0.5rem;", | |
| ".monaco-workbench .part.editor>.content": "padding: 0 10px 10px 10px; position: relative; background:#242424 !important;", | |
| ".monaco-workbench .part.editor .monaco-scrollable-element > .scrollbar.vertical": "margin-right:20px", | |
| ".monaco-workbench .part.editor>.content .editor-group-container": "border-radius: 0.5rem; height: calc(100% - 10px); width:calc(100% - 20px); overflow: hidden; box-shadow:rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px", | |
| ".monaco-editor": "border-radius: 0 0 0.5rem 0.5rem; overflow: hidden;", | |
| ".monaco-editor-background": "border-radius: 0.5rem;", | |
| ".monaco-workbench .part.editor>.content .editor-group-container>.title .tabs-container>.tab.active.tab-border-top>.tab-border-top-container, .monaco-workbench .part.editor>.content .editor-group-container>.title .tabs-container>.tab.selected.tab-border-top>.tab-border-top-container": "height: 0", | |
| ".breadcrumbs-below-tabs": "overflow: hidden; background: #1c1c1c", | |
| ".monaco-breadcrumbs": "font-size: 0.7rem", | |
| ".monaco-editor .sticky-widget": "box-shadow: none; border-color: #2b2d30", | |
| ".monaco-editor .scroll-decoration": "box-shadow: none", | |
| ".tabs-and-actions-container:has(.tab.active:first-child)": "box-shadow: -20px 5px 0 0 #1c1c1c; border-radius: 0.5rem 0.5rem 0 0;", | |
| ".monaco-split-view2.separator-border.vertical>.monaco-scrollable-element>.split-view-container>.split-view-view:not(:first-child):before": "background: #2b2d30 !important", | |
| ".monaco-split-view2.separator-border>.monaco-scrollable-element>.split-view-container>.split-view-view:not(:first-child):before": "background: #2b2d30 !important", | |
| ".monaco-workbench .part.titlebar>.titlebar-container>.titlebar-center>.window-title>.command-center .action-item.command-center-center": "border-radius: 0.5rem; border: none", | |
| ".titlebar-center, .titlebar-right": "opacity: 0.5; transition: all 0.15s", | |
| ".titlebar-center:hover, .titlebar-right:hover": "opacity: 1; pointer-events: all", | |
| "li.action-item.icon.checked, li.action-item.icon:hover": "opacity: 1", | |
| "li.action-item.icon": "transition: all 0.15s; opacity: 0.2", | |
| ".monaco-workbench .pane-composite-part>.header-or-footer>.composite-bar-container>.composite-bar>.monaco-action-bar .action-item.checked .active-item-indicator:before, .monaco-workbench .pane-composite-part>.header-or-footer>.composite-bar-container>.composite-bar>.monaco-action-bar .action-item:focus .active-item-indicator:before, .monaco-workbench .pane-composite-part>.title>.composite-bar-container>.composite-bar>.monaco-action-bar .action-item.checked .active-item-indicator:before, .monaco-workbench .pane-composite-part>.title>.composite-bar-container>.composite-bar>.monaco-action-bar .action-item:focus .active-item-indicator:before": "border-top-width:1px", | |
| // terminal related | |
| ".part.panel .composite-bar-container .actions-container .action-item:not(.checked) a": "color:rgb(120,120,120) !important", | |
| ".monaco-workbench .part.panel": "background:#1c1c1c !important; margin:0 10px 0 10px; height:calc(100% - 10px); border-radius:0.5rem; display:flex; flex-direction:column; box-shadow:rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px", | |
| // secondary sidebar | |
| ".monaco-workbench .part.auxiliarybar": "margin: 0 0 0 10px !important; border-radius: 0.5rem; height:calc(100% - 10px); display:flex; flex-direction:column;", | |
| // 3 dots menu shifting and bottom panel spacing | |
| "#workbench\\.parts\\.sidebar > div.composite.has-composite-bar.header-or-footer.footer > div > div": "width:100%", | |
| "#workbench\\.parts\\.sidebar > div.composite.has-composite-bar.header-or-footer.footer > div > div > div > ul": "justify-content:space-evenly", | |
| "#workbench\\.parts\\.sidebar > div.composite.title": "position:absolute; right:0; bottom:35px;", | |
| "#workbench\\.parts\\.sidebar": "height:100%;", | |
| "#workbench\\.parts\\.sidebar > div.composite.has-composite-bar.header-or-footer.footer": "transform:translateY(30px)", | |
| }, | |
| "custom-ui-style.font.sansSerif": "Dank Mono", // choose your font | |
| // Colors | |
| "workbench.colorCustomizations": { | |
| "sideBar.background": "#242424", | |
| "sideBar.foreground": "#676767", | |
| "sideBarSectionHeader.background": "#242424", | |
| "sideBarTitle.foreground": "#eeffff", | |
| "icon.foreground": "#ffffff80", | |
| "activityBar.activeBorder": "#d9b974", | |
| "activityBar.background": "#242424", | |
| "editor.background": "#1c1c1c", | |
| "activityBar.border": "#24242401", | |
| "activityBar.foreground": "#eeffff", | |
| "activityBarBadge.background": "#d9b974", | |
| "activityBarBadge.foreground": "#000000", | |
| "badge.background": "#00000030", | |
| "badge.foreground": "#545454", | |
| "breadcrumb.activeSelectionForeground": "#d9b974", | |
| "breadcrumb.background": "#1c1c1c", | |
| "breadcrumb.focusForeground": "#eeffff", | |
| "breadcrumb.foreground": "#676767", | |
| "breadcrumbPicker.background": "#242424", | |
| "button.background": "#ffcb6b", | |
| "button.hoverBackground": "#ffcb6bbe", | |
| "button.foreground": "#242424", | |
| "button.secondaryBackground": "#ffffff12", | |
| "button.secondaryHoverBackground": "#ffffff25", | |
| "toolbar.hoverBackground": "#ffffff12", | |
| "debugConsole.errorForeground": "#f07178", | |
| "debugConsole.infoForeground": "#89ddff", | |
| "debugConsole.warningForeground": "#ffcb6b", | |
| "debugToolBar.background": "#242424", | |
| "diffEditor.insertedTextBackground": "#89ddff20", | |
| "diffEditor.removedTextBackground": "#ff9cac20", | |
| "dropdown.background": "#242424", | |
| "dropdown.border": "#ffffff10", | |
| "editor.findMatchBackground": "#000000", | |
| "editor.findMatchBorder": "#d9b974", | |
| "editor.findMatchHighlightBackground": "#00000050", | |
| "editor.findMatchHighlightBorder": "#ffffff30", | |
| "editor.findRangeHighlightBackground": "#ffcb6b30", | |
| "editor.lineHighlightBackground": "#b0afad14", | |
| "editor.lineHighlightBorder": "#11111123", | |
| "editor.rangeHighlightBackground": "#ffffff0d", | |
| "editor.selectionBackground": "#61616150", | |
| "editor.selectionHighlightBackground": "#ffcc0020", | |
| "editor.wordHighlightBackground": "#ff9cac30", | |
| "editor.wordHighlightStrongBackground": "#c3e88d30", | |
| "editorBracketMatch.background": "#242424", | |
| "editorBracketMatch.border": "#ffcc0050", | |
| "editorCursor.foreground": "#ffcc00", | |
| "editorError.foreground": "#f0717870", | |
| "editorGroup.border": "#00000030", | |
| "editorGroup.dropBackground": "#f0717880", | |
| "editorGroup.focusedEmptyBorder": "#f07178", | |
| "editorGutter.addedBackground": "#c3e88d60", | |
| "editorGroupHeader.tabsBackground": "#242424", | |
| "editorGutter.deletedBackground": "#f0717860", | |
| "editorGutter.modifiedBackground": "#82aaff60", | |
| "editorHoverWidget.background": "#202020bb", | |
| "editorHoverWidget.border": "#ffffff10", | |
| "editorIndentGuide.activeBackground1": "#424242", | |
| "editorIndentGuide.background1": "#42424270", | |
| "editorInfo.foreground": "#82aaff70", | |
| "editorLineNumber.activeForeground": "#e2e2e2", | |
| "editorLineNumber.foreground": "#424242", | |
| "editorLink.activeForeground": "#eeffff", | |
| "editorMarkerNavigation.background": "#eeffff05", | |
| "editorOverviewRuler.border": "#24242400", | |
| "editorOverviewRuler.errorForeground": "#f0717840", | |
| "editorOverviewRuler.findMatchForeground": "#d9b974e7", | |
| "editorOverviewRuler.infoForeground": "#82aaff40", | |
| "editorOverviewRuler.warningForeground": "#ffcb6b40", | |
| "editorRuler.foreground": "#424242", | |
| "editorSuggestWidget.background": "#202020bb", | |
| "editorSuggestWidget.border": "#ffffff10", | |
| "editorSuggestWidget.foreground": "#eeffff", | |
| "editorSuggestWidget.highlightForeground": "#d9b974", | |
| "editorSuggestWidget.selectedBackground": "#00000050", | |
| "editorWarning.foreground": "#ffcb6b70", | |
| "editorWhitespace.foreground": "#eeffff40", | |
| "editorWidget.background": "#202020bb", | |
| "editorWidget.border": "#d9b974", | |
| "editorWidget.resizeBorder": "#d9b974", | |
| "extensionBadge.remoteForeground": "#eeffff", | |
| "extensionButton.prominentBackground": "#c3e88d90", | |
| "extensionButton.prominentForeground": "#eeffff", | |
| "extensionButton.prominentHoverBackground": "#c3e88d", | |
| "focusBorder": "#ffffff00", | |
| "foreground": "#eeffff", | |
| "gitDecoration.conflictingResourceForeground": "#ffcb6b90", | |
| "gitDecoration.deletedResourceForeground": "#f0717890", | |
| "gitDecoration.ignoredResourceForeground": "#67676790", | |
| "gitDecoration.modifiedResourceForeground": "#82aaff90", | |
| "gitDecoration.untrackedResourceForeground": "#c3e88d90", | |
| "input.background": "#2b2b2b", | |
| "input.border": "#ffffff10", | |
| "input.foreground": "#eeffff", | |
| "input.placeholderForeground": "#eeffff60", | |
| "inputOption.activeBackground": "#eeffff30", | |
| "inputOption.activeBorder": "#eeffff30", | |
| "inputValidation.errorBorder": "#f07178", | |
| "inputValidation.infoBorder": "#82aaff", | |
| "inputValidation.warningBorder": "#ffcb6b", | |
| "list.activeSelectionBackground": "#ffffff12", | |
| "list.activeSelectionForeground": "#d9b974", | |
| "list.dropBackground": "#f0717880", | |
| "list.focusBackground": "#ffffff12", | |
| "list.focusForeground": "#eeffff", | |
| "list.highlightForeground": "#d9b974", | |
| "list.hoverBackground": "#ffffff12", | |
| "list.hoverForeground": "#ffffff", | |
| "list.inactiveSelectionBackground": "#ffffff12", | |
| "list.inactiveSelectionForeground": "#d9b974", | |
| "listFilterWidget.background": "#00000030", | |
| "listFilterWidget.noMatchesOutline": "#00000030", | |
| "listFilterWidget.outline": "#00000030", | |
| "menu.background": "#202020", | |
| "menu.foreground": "#eeffff", | |
| "menu.border": "#ffffff09", | |
| "menu.selectionBackground": "#ffffff12", | |
| "menu.selectionBorder": "#00000020", | |
| "menu.selectionForeground": "#d9b974", | |
| "menu.separatorBackground": "#ffffff25", | |
| "menubar.selectionBackground": "#00000030", | |
| "menubar.selectionBorder": "#00000030", | |
| "menubar.selectionForeground": "#d9b974", | |
| "notebook.focusedCellBorder": "#d9b974", | |
| "notebook.inactiveFocusedCellBorder": "#d9b97450", | |
| "notificationLink.foreground": "#d9b974", | |
| "notifications.background": "#20202075", | |
| "notifications.foreground": "#eeffff", | |
| "panel.background": "#242424", | |
| "panel.border": "#ffffff09", | |
| "panelTitle.activeBorder": "#d9b974", | |
| "panelTitle.activeForeground": "#ffffff", | |
| "panelTitle.inactiveForeground": "#eeffff", | |
| "peekView.border": "#00000030", | |
| "peekViewEditor.background": "#2b2b2b", | |
| "peekViewEditor.matchHighlightBackground": "#61616150", | |
| "peekViewEditorGutter.background": "#2b2b2b", | |
| "peekViewResult.background": "#2b2b2b", | |
| "peekViewResult.matchHighlightBackground": "#61616150", | |
| "peekViewResult.selectionBackground": "#67676770", | |
| "peekViewTitle.background": "#2b2b2b", | |
| "peekViewTitleDescription.foreground": "#eeffff60", | |
| "pickerGroup.border": "#ffffff1a", | |
| "pickerGroup.foreground": "#d9b974", | |
| "progressBar.background": "#d9b974", | |
| "quickInput.background": "#202020bb", | |
| "quickInput.foreground": "#999999", | |
| "quickInputList.focusBackground": "#eeffff20", | |
| "sash.hoverBorder": "#d9b97450", | |
| "scrollbar.shadow": "#00000030", | |
| "scrollbarSlider.activeBackground": "#d9b974", | |
| "scrollbarSlider.background": "#eeffff20", | |
| "scrollbarSlider.hoverBackground": "#eeffff36", | |
| "selection.background": "#00000080", | |
| "settings.checkboxBackground": "#242424", | |
| "settings.checkboxForeground": "#eeffff", | |
| "settings.dropdownBackground": "#242424", | |
| "settings.dropdownForeground": "#eeffff", | |
| "settings.headerForeground": "#d9b974", | |
| "settings.modifiedItemIndicator": "#d9b974", | |
| "settings.numberInputBackground": "#242424", | |
| "settings.numberInputForeground": "#eeffff", | |
| "settings.textInputBackground": "#242424", | |
| "settings.textInputForeground": "#eeffff", | |
| "statusBar.background": "#242424", | |
| "statusBar.border": "#24242460", | |
| "statusBar.debuggingBackground": "#c792ea", | |
| "statusBar.debuggingForeground": "#ffffff", | |
| "statusBar.foreground": "#616161", | |
| "statusBar.noFolderBackground": "#242424", | |
| "statusBarItem.activeBackground": "#f0717880", | |
| "statusBarItem.hoverBackground": "#54545420", | |
| "statusBarItem.remoteBackground": "#d9b974", | |
| "statusBarItem.remoteForeground": "#000000", | |
| "tab.activeBackground": "#ffffff12", | |
| "tab.activeForeground": "#ffffff", | |
| "tab.activeModifiedBorder": "#676767", | |
| "tab.border": "#242424", | |
| "tab.inactiveBackground": "#242424", | |
| "tab.inactiveForeground": "#676767", | |
| "tab.inactiveModifiedBorder": "#904348", | |
| "tab.unfocusedActiveBorder": "#545454", | |
| "tab.unfocusedActiveForeground": "#eeffff", | |
| "tab.unfocusedActiveModifiedBorder": "#c05a60", | |
| "tab.unfocusedInactiveModifiedBorder": "#904348", | |
| "terminal.background": "#1c1c1c", | |
| "terminal.ansiBlack": "#000000", | |
| "terminal.ansiBlue": "#82aaff", | |
| "terminal.ansiBrightBlack": "#545454", | |
| "terminal.ansiBrightBlue": "#82aaff", | |
| "terminal.ansiBrightCyan": "#89ddff", | |
| "terminal.ansiBrightGreen": "#c3e88d", | |
| "terminal.ansiBrightMagenta": "#c792ea", | |
| "terminal.ansiBrightRed": "#f07178", | |
| "terminal.ansiBrightWhite": "#ffffff", | |
| "terminal.ansiBrightYellow": "#ffcb6b", | |
| "terminal.ansiCyan": "#89ddff", | |
| "terminal.ansiGreen": "#c3e88d", | |
| "terminal.ansiMagenta": "#c792ea", | |
| "terminal.ansiRed": "#f07178", | |
| "terminal.ansiWhite": "#ffffff", | |
| "terminal.ansiYellow": "#ffcb6b", | |
| "terminalCursor.background": "#000000", | |
| "terminalCursor.foreground": "#ffcb6b", | |
| "textLink.activeForeground": "#eeffff", | |
| "textLink.foreground": "#d9b974", | |
| "titleBar.activeBackground": "#242424", | |
| "titleBar.activeForeground": "#676767", | |
| "titleBar.border": "#24242460", | |
| "titleBar.inactiveBackground": "#242424", | |
| "titleBar.inactiveForeground": "#676767", | |
| "tree.indentGuidesStroke": "#424242", | |
| "widget.shadow": "#00000030", | |
| "widget.border": "#ffffff09" | |
| }, | |
| "workbench.activityBar.orientation": "vertical", | |
| "redhat.telemetry.enabled": true, | |
| "workbench.sideBar.location": "right", | |
| "terminal.integrated.tabs.enabled": false, | |
| "workbench.statusBar.visible": false, | |
| } |
Instructions :
Add to your user settings JSON file the custom-ui-style.stylesheet (you need to use this extension or use other extension which allows you to customize VS Code UI using CSS), you will also need to match the colors, or it will look weird, so this is this part "workbench.colorCustomizations".
Make sure not to replace the entire settings JSON file because you might have other unrelated settings there for your extensions.
I did clean up a bit this settings file to not include unrelated settings.
Theme : One Dark Pro Monokai Darker
Font : Fira Code Retina for code , Consolas for vs-code UI.
Credits to this post
How it looks like (updated revision 10) :
https://f3zt4im3rd.ufs.sh/f/F0BpEl6F0ft7b3JXCc1sItxqcBYOirPR3zKAC2GVJfLj8wlm
my UI font is too big, how to change the size?
my UI font is too big, how to change the size?
I didn't mess with any of the font sizes (except for breadcrumbs) maybe it's the font that makes it look bigger? Or maybe some other setting you have set. Also, make sure the editor is not zoomed in (Ctrl -/+)
There is a problem with the CSS with Jupyter Notebooks where the settings below the header are in a weird position and the Notebook's side extend to the sidebar
![]()
That's because Microsoft devs can't write proper HTML. It seems like the notebook element is a completely different layer and not inside the editor part. (it's parent is the whole area including the sidebars which is so wrong). I will look into it and try to find a good CSS solution





Revision 2+3 : added subtle box shadows for the different windows.
Fixed marketplace page is not rounded.