VS Code custom/master pieces themes!

[drcika]

Here you can share your works. it is preferable that you share the configuration as well as the image

[muhammadfaruq72]

[drcika]

vibrancy

[ghost]

Long ago, I completed Caleb Porzio's MakeVSCodeAwesome course and found the Customize UI and Monkey Patch tools to be incredibly useful in my daily workflow. However, I've been struggling to achieve the desired "full-bleed window" effect since the recent updates (mangling stuff with VSCode).

But guess what? I finally did it!

@drcika, your extension is absolutely breathtaking! Thank you for creating such an amazing tool. We appreciate your hard work ;)

Output (on Windows 10)

Settings.json

  "workbench.editor.showTabs": false,

  "apc.electron": {
    "titleBarStyle": "hidden"
  },
  "window.titleBarStyle": "native",

  "apc.stylesheet": {
      // Change cursor color
      ".monaco-editor .cursor": "background: linear-gradient(to bottom, #ee0979, #ff6a00) !important; box-shadow: 0 0 42px 5px #ee0979, #ff6a00 0px 0px 34px 1px; color: #161616 !important",
  },

[jsonkenyon]

I was in the same boat as @backermanbd used Caleb Porzio's "Make VSCode Awesome", thanks to this extension I was able to get back and then some of the style that I wanted!

MacOS

Settings.json that was updated to work with this extension:

    "window.titleBarStyle": "native",
    "apc.electron": {
        // hide trafficlights unless hovered
        "titleBarStyle": "customButtonsOnHover",
        "trafficLightPosition": {
            "x": 7,
            "y": 5
          }
    },
    "apc.stylesheet": {
        ".editor .title": "background: transparent !important;",
        ".editor .title-border-bottom": "visibility: hidden !important;",
    }
    // Hide scrollbar shadow.
    "workbench.colorCustomizations": {
        "scrollbar.shadow": "#22212C",
    },

[ghost]

@jsonkenyon Instead of this chunk

     // Hide scrollbar shadow.
     "workbench.colorCustomizations": {
         "scrollbar.shadow": "#22212C",
     },

You can use this code in apc.stylesheet.

     // Only show the scrollbar on hover
     ".editor .scrollbar .slider": "visibility: hidden",
     ".editor .scrollbar:hover .slider": "visibility: initial",

[jsonkenyon]

@jsonkenyon Instead of this chunk

    // Hide scrollbar shadow.
    "workbench.colorCustomizations": {
        "scrollbar.shadow": "#22212C",
    },

You can use this code in apc.stylesheet.

     // Only show the scrollbar on hover
     ".editor .scrollbar .slider": "visibility: hidden",
     ".editor .scrollbar:hover .slider": "visibility: initial",

@backermanbd Hey, thanks, indeed I have that also. Though on MacOS, it looks like there is a new shadow introduced on the title. Which is what that one is taking care of.

Without that chunk:

With the chunk:

Though, I'm sure there is a better way of getting it with just the css, I just haven't taken a look deeper yet.

EDIT Found it and replaced with just this CSS which does the trick:

        ".editor .scroll-decoration": "visibility: hidden;",

[ghost]

@jsonkenyon Sheer brilliance! Btw, how did you remove all the buttons from Explorer panel?

PS: here's my most used stylesheet code.

      // Hide editor top-right buttons, except for the dirty file indicator and settings goto icon
      ".editor .title .actions-container .action-item a:not(.codicon-close-dirty):not(.codicon-preferences-open-settings)": "display: none !important;",

[jsonkenyon]

@backermanbd - I didn't actually do anything in this case, it just hides automatically unless I hover over the explorer panel or select something, then the buttons appear. Though took a look and I'm thinking the following would do the trick for you.

".monaco-toolbar": "visibility: hidden !important;",

[aexvir]

found out just today about this extension as I finally opened vscode after a long while and I was cleaning out unused extensions, so I had to remove customize ui

@drcika thanks a ton for bringing this functionality back up! I just can't stand vscode's default ui stiffness

I've managed to pretty much replicate my setup from customize ui in just a couple lines of config, which is awesome, but I still had a bunch of custom css that I need to fix before being able to use it as it seems a bunch of stuff changed since the last time I used vscode

"window.titleBarStyle": "native",
  "apc.electron": {
    "titleBarStyle": "hiddenInset",
    "trafficLightPosition": {
      "x": 12,
      "y": 8
    }
  },
  "apc.font.family": "JetBrains Mono",
  "apc.stylesheet": {
    // remove overview ruler completely
    ".editor .decorationsOverviewRuler": "display: none !important",
    // make sticky widget fill the space left by the overview ruler
    ".editor .sticky-widget": "padding-right: 14px !important",
    // make sidebar titles and statusbar lowercase
    ".monaco-workbench .part.sidebar>.title>.title-label *": "text-transform: lowercase !important",
    ".monaco-pane-view .pane>.pane-header>.title": "text-transform: lowercase !important",
    ".statusbar *": "text-transform: lowercase !important"
  },

[HeyProtagonist]

In CustomizeUI I had emojis for the OS Window Actions Icons... Somehow it didn't work on APC..! But I'm okay with the tradeoff ❤️‍🔥

[xesrevinu]

Like Apple Vision Pro but VSCode, thank you @drcika Apc Customize UI++ and customize-ui

Config

```json { "workbench.colorCustomizations": { "scrollbar.shadow": "#ffffff00", "[One Monokai Dark]": { "scrollbar.shadow": "#ffffff00", "editorInlayHint.typeBackground": "#ffffff00", "editorInlayHint.foreground": "#adadadcc", "editorGroupHeader.tabsBackground": "#00000000", "sideBar.background": "#3635351d", "sideBarSectionHeader.background": "#00000000", "editor.background": "#3635351d", "peekViewEditor.background": "#00000000", "peekViewEditorGutter.background": "#00000000", "peekViewTitle.background": "#00000000", "peekViewResult.background": "#00000000", "editorSuggestWidget.background": "#5e5e5ec5", "editorSuggestWidget.border": "#e3e3e37d", "editorSuggestWidget.selectedBackground": "#b5b4b440", "editorSuggestWidget.highlightForeground": "#f1f1f1e2", "editorSuggestWidget.focusHighlightForeground": "#f1f1f1e2", "editorSuggestWidget.foreground": "#cccccce2", "editorSuggestWidget.selectedForeground": "#f1f1f1e2", "tab.activeBackground": "#00000000", "tab.inactiveBackground": "#00000000", "statusBar.background": "#00000000", "statusBar.debuggingBackground": "#00000000", "statusBar.noFolderBackground": "#00000000", "statusBarItem.activeBackground": "#00000000", "editor.selectionBackground": "#00000000", "panel.background": "#00000000", "activityBar.background": "#00000000", "editor.selectionHighlightBackground": "#565e616f", "editor.lineHighlightBackground": "#b5b5b530", "editor.lineHighlightBorder": "#ffffff00" } }, "apc.activityBar": { "position": "bottom", "hideSettings": true, "size": 24 }, "apc.statusBar": { "position": "editor-bottom", "height": 20, "fontSize": 11 }, "apc.electron": { "titleBarStyle": "hiddenInset", "trafficLightPosition": { "x": 7, "y": 8 }, "frame": false, "transparent": true, "vibrancy": "ultra-dark", "backgroundColor": "#3635351d", "visualEffectState": "active" }, "apc.header": { "height": 28, "fontSize": 13 }, "apc.font.family": "JetBrainsMono-Regular", "apc.monospace.font.family": "JetBrainsMono-Regular", "apc.stylesheet": { // remove overview ruler completely ".editor .decorationsOverviewRuler": "display: none !important", // make sticky widget fill the space left by the overview ruler ".editor .sticky-widget": "padding-right: 14px !important", // make sidebar titles and statusbar lowercase ".monaco-workbench .part.sidebar>.title>.title-label *": "text-transform: lowercase !important", ".monaco-pane-view .pane>.pane-header>.title": "text-transform: lowercase !important" } } ```

[bushaev-denis]

---

Full

☀️ Light


🌑 Dark


---

Manual

### Theme [VSCode](https://marketplace.visualstudio.com/items?itemName=davidbwaters.macos-modern-theme) / [VSCodium](https://open-vsx.org/extension/dez64ru/macos-modern-theme) ### Font https://github.com/supercomputra/SF-Mono-Font ### Settings ```json { "workbench.layoutControl.enabled": false, "editor.minimap.enabled": false, "window.autoDetectColorScheme": true, "workbench.colorTheme": "MacOS Modern Dark - Ventura Xcode", "workbench.preferredLightColorTheme": "MacOS Modern Light - Ventura Xcode Default", "workbench.preferredDarkColorTheme": "MacOS Modern Dark - Ventura Xcode", "workbench.iconTheme": null, "window.titleBarStyle": "native", "workbench.editor.decorations.badges": false, "workbench.editor.showIcons": false, "workbench.editor.tabCloseButton": "off", "breadcrumbs.enabled": false, "editor.rulers": [120], "apc.electron": { "titleBarStyle": "hiddenInset", "frame": false, "apc.font.family": "SF Mono", "apc.monospace.font.family": "SF Mono", "vibrancy": "sidebar", "visualEffectState": "active", "transparent": true, "backgroundColor": "rgba(0,0,0,0)" }, "apc.stylesheet": { "#workbench\\.parts\\.sidebar > .composite.title": "opacity: 0; pointer-events: none", ".title.tabs.title-border-bottom .tabs-container": "cursor: default; -webkit-app-region: no-drag;", ".editor-actions": "display: none;", ".monaco-list-rows": "background-color: transparent !important;", ".nosidebar .tabs": "padding-left: 80px;", ".scrollbar": " width: 10px !important", ".scrollbar .slider": "border-radius: 6px; width: calc(100% - 2px) !important;" }, "workbench.colorCustomizations": { "focusBorder": "#ff000000", "[*Light*]": { "sideBar.background": "#F8F8F7aa", "sideBarSectionHeader.background": "#F8F8F7aa", "statusBar.background": "#F8F8F7aa", "list.hoverBackground": "#CEDEEF88" }, "[*Dark*]": { "sideBar.background": "#363333aa", "sideBarSectionHeader.background": "#363333aa", "statusBar.background": "#363333aa", "list.hoverBackground": "#46464699" } }, // font "editor.fontLigatures": true, "editor.fontFamily": "SF Mono, Menlo, Monaco, 'Courier New', monospace", "editor.glyphMargin": false, } ```

[Yukaii]

Jebrains Mono everywhere with vibrancy!

  "apc.electron": {
    "frame": false,
    "backgroundColor": "rgba(0,0,0,0.95)",
    "vibrancy": "ultra-dark",
    "visualEffectState": "active",
  },
  "apc.font.family": "Jetbrains Mono",
  "apc.monospace.font.family": "Jetbrains Mono",
  "apc.menubar.compact": true,
  "window.titleBarStyle": "native",
  "workbench.colorTheme": "Expo Dark",
  "workbench.iconTheme": "file-icons",

  "workbench.colorCustomizations": {
    "editorGroupHeader.tabsBackground": "#00000000",
    "sideBar.background": "#00000000",
    "sideBarSectionHeader.background": "#00000000",
    "editor.background": "#00000000",
    "peekViewEditor.background": "#00000000",
    "peekViewEditorGutter.background": "#00000000",
    "peekViewTitle.background": "#00000000",
    "peekViewResult.background": "#00000000",
    "tab.inactiveBackground": "#00000000",
    "statusBar.background": "#00000000",
    "panel.background": "#00000000",
    "sash.hoverBorder": "#ffffff3e",
    "sideBar.border": "#ffffff23"
  },

[sackboy19]

Xcode inspired <3

Active:

Inactive:

Config:

Theme

#### Color theme (Xcode Default Dark Customized Version) [https://marketplace.visualstudio.com/items?itemName=MateoCERQUETELLA.xcode-12-theme](https://marketplace.visualstudio.com/items?itemName=MateoCERQUETELLA.xcode-12-theme) #### File icon theme (Monokai Pro Icons) [https://marketplace.visualstudio.com/items?itemName=monokai.theme-monokai-pro-vscode](https://marketplace.visualstudio.com/items?itemName=monokai.theme-monokai-pro-vscode) #### Product icon theme (MacOS Modern) [https://marketplace.visualstudio.com/items?itemName=davidbwaters.macos-modern-theme](https://marketplace.visualstudio.com/items?itemName=davidbwaters.macos-modern-theme) #### Settings ```json { "editor.fontFamily": "SF Mono", "editor.fontSize": 11, "editor.fontWeight": 550, "editor.bracketPairColorization.enabled": true, "editor.indentSize": 2, "editor.roundedSelection": true, "editor.smoothScrolling": true, "editor.cursorSmoothCaretAnimation": "on", "editor.cursorWidth": 1, "editor.cursorBlinking": "phase", "editor.inlayHints.enabled": "off", "editor.glyphMargin": false, "editor.inlayHints.padding": true, "editor.scrollbar.verticalScrollbarSize": 9, "editor.scrollbar.vertical": "visible", "editor.scrollbar.horizontalScrollbarSize": 9, "window.autoDetectColorScheme": true, "workbench.fontAliasing": "default", "window.titleBarStyle": "native", "editor.padding.top": 6, "breadcrumbs.filePath": "on", "editor.guides.indentation": true, "apc.statusBar": { "height": 32 }, "apc.electron": { "titleBarStyle": "hiddenInset", "trafficLightPosition": { "x": 18, "y": 17 }, "backgroundColor": "#00000000", "transparent": true, "vibrancy": "sidebar" }, "apc.header": { "height": 24 }, "apc.sidebar.titlebar": { "height": 46, "fontSize": 12 }, "apc.activityBar": { "size": 40, "itemSize": 36, "itemMargin": 8, "position": "bottom", "hideSettings": true }, "apc.stylesheet": { ".custom-sidebar-titlebar .sidebar .composite.title .title-label": "visibility: hidden;", ".custom-sidebar-titlebar .sidebar .composite.title .title-actions": "padding-left: -100px; padding-top: 2px;", ".monaco-workbench .part.statusbar>.items-container>.statusbar-item.left.first-visible-item": "padding-left: 0;", ".statusbar #status\\.host": "display: block !important; width: calc(var(--activity-bar-action-size) - 1px); background: [#555](https://github.com/lehni/vscode-titlebar-less-macos/issues/555) !important;", ".statusbar #status\\.host .codicon": "margin: 0 auto;", "div.invisible.scrollbar.vertical.fade .slider": "border-radius: 10px !important;", "div.visible.scrollbar.vertical .slider": "border-radius: 10px !important;", "div.invisible.scrollbar.horizontal.fade .slider": "border-radius: 10px !important;", "div.visible.scrollbar.horizontal .slider": "border-radius: 10px !important;", ".monaco-editor .cursors-layer.cursor-block-style .cursor": "transform: translateX(-1px); width: 9px !important; color: transparent; border-width: 1px; border-color: #ffffff8b; border-style: solid; border-radius: 2px; background: #ffffff4b", ".breadcrumbs-control": "height: 18px", ".monaco-breadcrumbs": "font-size: 11px; transform: translateY(0px);", "body": "border: 1px solid #ffffff1f; border-radius: 10px; box-sizing: border-box;", ".monaco-workbench .part.statusbar": "border-bottom: 2px solid #ffffff1f; border-radius: 9px; border-bottom-right-radius: 13.5px", ".monaco-workbench .part.editor[role=main]": "border-right: 1.5px solid #ffffff1f; border-top-right-radius: 12px", ".monaco-workbench .part.panel.basepanel.bottom": "border-right: 2px solid #ffffff1f; border-right-color: #ffffff1f !important;", }, "workbench.colorCustomizations": { "editorCursor.foreground": "#ffffff8d", "editorBracketMatch.border": "#d9d9d9", "editor.lineHighlightBackground": "#00000000", "editor.lineHighlightBorder": "#00000000", "editorIndentGuide.background1": "#ffffff10", "editorIndentGuide.activeBackground1": "#b4b4b437", "focusBorder": "#00000000", "statusBar.background": "#23232300", "statusBarItem.remoteBackground": "#ffffff00", "statusBar.border": "#ffffff1e", "sash.hoverBorder": "#afafaf00", "editorGroupHeader.border": "#ffffff00", "activityBar.background": "#27272700", "sideBar.background": "#1f1f1f00", "activityBar.border": "#ffffff00", "list.inactiveSelectionBackground": "#ffffff11", "[Xcode Default Dark Customized Version]": { "editorCursor.foreground": "#357bff", "scrollbar.shadow": "#00000000", "editorGroupHeader.border": "#ffffff1c" } } } ```

[phen0menon]

[dalsvk]

found out just today about this extension as I finally opened vscode after a long while and I was cleaning out unused extensions, so I had to remove customize ui

@drcika thanks a ton for bringing this functionality back up! I just can't stand vscode's default ui stiffness

I've managed to pretty much replicate my setup from customize ui in just a couple lines of config, which is awesome, but I still had a bunch of custom css that I need to fix before being able to use it as it seems a bunch of stuff changed since the last time I used vscode

"window.titleBarStyle": "native",
  "apc.electron": {
    "titleBarStyle": "hiddenInset",
    "trafficLightPosition": {
      "x": 12,
      "y": 8
    }
  },
  "apc.font.family": "JetBrains Mono",
  "apc.stylesheet": {
    // remove overview ruler completely
    ".editor .decorationsOverviewRuler": "display: none !important",
    // make sticky widget fill the space left by the overview ruler
    ".editor .sticky-widget": "padding-right: 14px !important",
    // make sidebar titles and statusbar lowercase
    ".monaco-workbench .part.sidebar>.title>.title-label *": "text-transform: lowercase !important",
    ".monaco-pane-view .pane>.pane-header>.title": "text-transform: lowercase !important",
    ".statusbar *": "text-transform: lowercase !important"
  },

Hi, which theme is this? Looks very calm and comfy. Thanks

[wfern]

Not much different from the original, most changes are spacing-related. With this, I can open two windows side by side on a 1920x1080 monitor without word wrapping or shrinking panels.

Settings:

{
    "editor.fontFamily": "'JetBrains Mono', Consolas, 'Courier New', monospace",
    "editor.fontSize": 11.75,
    "workbench.colorCustomizations": {
        "tab.activeBackground": "#1e1e1e",
        "tab.hoverBackground": "#2c2c2c"
    },
    "workbench.colorTheme": "GitHub Dark Default",
    "window.titleBarStyle": "native",
    "apc.electron": {
        "titleBarStyle": "hidden",
        "trafficLightPosition": {
            "x": 12,
            "y": 10
        }
    },
    "apc.activityBar": {
        "position": "bottom",
        "size": 32
    },
    "apc.header": {
        "fontSize": 11,
    },
    "apc.listRow": {
        "fontSize": 11.25,
        "height": 18
    },
    "apc.statusBar": {
        "fontSize": 11,
        "height": 22,
        "position": "bottom"
    },
    "apc.sidebar.titlebar": {
        "fontSize": 12,
    },
    "apc.stylesheet": {
        // activity bar
        ".activitybar .action-item.checked .active-item-indicator:before": "bottom: 0px !important;",
        ".activitybar .action-label": "font-size: 20px !important;",
        ".activitybar .badge .badge-content": "top: 3px !important; padding: 0 3px !important; font-size: 9px !important; height: 12px !important; line-height: 12px !important;",
        // explorer: align right icons, the line height must match apc.listRow.height
        ".explorer-folders-view .explorer-item::after": "line-height: 18px !important;",
        // explorer: remove extra padding from the tree view
        ".explorer-folders-view .monaco-list-row": "padding-left: 0 !important;",
        // sidebar tree views: set and adjust font
        ".sidebar .monaco-icon-label > .monaco-icon-label-container": "font-family: 'JetBrains Mono'; letter-spacing: -0.750px;",
        // sidebar title: adjust padding and add border
        ".sidebar > .title": "border-bottom: 1px solid var(--vscode-sideBarSectionHeader-border) !important;",
        ".sidebar .title .title-label": "display: none !important;",
        ".sidebar .title .title-actions": "flex: 1 !important;",
        ".sidebar .content": "height: 100% !important;",
        // base panel (terminal, etc...): decrease height
        ".basepanel .title": "height: 30px !important;",
        ".basepanel .title .monaco-action-bar": "height: 30px !important;",
        ".basepanel .title .title-actions": "height: 30px !important;",
    }
}

[h-jia]

        ".basepanel .title": "height: 30px !important;",
        ".basepanel .title .monaco-action-bar": "height: 30px !important;",
        ".basepanel .title .title-actions": "height: 30px !important;",

Thanks for the configs! for the last three lines:

when using light theme it will cause a black area at the bottom of panel area (and cannot be right clicked):

Any suggestions for this? Thanks

[wfern]

        ".basepanel .title": "height: 30px !important;",
        ".basepanel .title .monaco-action-bar": "height: 30px !important;",
        ".basepanel .title .title-actions": "height: 30px !important;",

Thanks for the configs! for the last three lines:

when using light theme it will cause a black area at the bottom of panel area (and cannot be right clicked):

Any suggestions for this? Thanks

Unfortunately not. In some parts of the panel, when we reduce the size of one, there is space left over in others and the width or height of these parts that remain are dynamic and in "px" not "%", so there is no way... Example, if change the size of the sidebar's "titlebar", the bottom of the sidebar will also have space left over.

@drcika any ideas?

[KiligFei]

今天才发现这个扩展，因为我在很长一段时间后终于打开了 vscode，并且正在清理未使用的扩展，所以我不得不删除自定义 ui

@drcika非常感谢您恢复此功能！我只是无法忍受 vscode 默认的 ui 僵硬

我已经成功地在几行配置中从自定义 ui 复制了我的设置，这非常棒，但是我仍然有一堆自定义 css，我需要在能够使用它之前修复它们，因为它看起来一堆自从我上次使用 vscode 以来，有些东西发生了变化

"window.titleBarStyle": "native",
  "apc.electron": {
    "titleBarStyle": "hiddenInset",
    "trafficLightPosition": {
      "x": 12,
      "y": 8
    }
  },
  "apc.font.family": "JetBrains Mono",
  "apc.stylesheet": {
    // remove overview ruler completely
    ".editor .decorationsOverviewRuler": "display: none !important",
    // make sticky widget fill the space left by the overview ruler
    ".editor .sticky-widget": "padding-right: 14px !important",
    // make sidebar titles and statusbar lowercase
    ".monaco-workbench .part.sidebar>.title>.title-label *": "text-transform: lowercase !important",
    ".monaco-pane-view .pane>.pane-header>.title": "text-transform: lowercase !important",
    ".statusbar *": "text-transform: lowercase !important"
  },

Hello, your theme looks very comfortable and peaceful, can you tell me the name? thank you.

[mv-stns]

@dannylol19 is it somehow possible to stay dark mode when system is light? the custom dark theme doesnt seem to stay on my end as soon as i switch and looks like this... which hurts my eyes bad

[sackboy19]

@mv-stns Yes, just set: "workbench.preferredLightColorTheme": "Xcode Default (Dark Customized Version)" in your settings.json

[phen0menon]

Sharing my new VS Code!

Config

``` { "editor.fontFamily": "'jetbrains mono', 'Helvetica Neue', monospace", "editor.mouseWheelZoom": false, "javascript.validate.enable": false, "workbench.startupEditor": "none", "editor.wordWrap": "on", "editor.fontLigatures": true, "editor.fastScrollSensitivity": 10, "editor.mouseWheelScrollSensitivity": 3, "editor.smoothScrolling": true, "editor.multiCursorModifier": "ctrlCmd", "workbench.statusBar.feedback.visible": false, "typescript.updateImportsOnFileMove.enabled": "always", "files.simpleDialog.enable": true, "emmet.triggerExpansionOnTab": true, "workbench.editor.showTabs": true, "workbench.editor.enablePreviewFromQuickOpen": false, "javascript.updateImportsOnFileMove.enabled": "always", "workbench.activityBar.visible": true, "editor.renderControlCharacters": false, "git.confirmSync": false, "editor.fontWeight": "400", "files.associations": { "*.html": "html" }, "window.title": "${dirty}${activeEditorShort}${separator}${rootName}${separator} ${appName}", "editor.letterSpacing": -0.3, "git.autofetch": true, "editor.folding": false, "editor.lineHeight": 26, "editor.matchBrackets": "always", "editor.scrollbar.horizontal": "hidden", "explorer.openEditors.visible": 1, "workbench.editor.showIcons": false, "sync.autoUpload": false, "editor.quickSuggestions": { "other": true, "comments": false, "strings": false }, "editor.quickSuggestionsDelay": 50, "explorer.confirmDragAndDrop": false, "editor.tabCompletion": "on", "editor.cursorBlinking": "smooth", "editor.cursorSmoothCaretAnimation": "on", "editor.cursorWidth": 3, "editor.minimap.enabled": false, "editor.fontSize": 11, "git.ignoreMissingGitWarning": true, "explorer.confirmDelete": false, "editor.bracketPairColorization.enabled": true, "security.workspace.trust.untrustedFiles": "open", "editor.unicodeHighlight.ambiguousCharacters": false, "extensions.ignoreRecommendations": true, "editor.guides.indentation": true, "editor.inlayHints.fontSize": 14, "javascript.inlayHints.enumMemberValues.enabled": true, "editor.inlayHints.padding": true, "javascript.inlayHints.functionLikeReturnTypes.enabled": true, "javascript.inlayHints.parameterTypes.enabled": true, "javascript.inlayHints.propertyDeclarationTypes.enabled": true, "javascript.inlayHints.variableTypes.enabled": true, "typescript.inlayHints.enumMemberValues.enabled": true, "typescript.inlayHints.parameterTypes.enabled": true, "update.mode": "manual", "editor.inlineSuggest.enabled": true, "vscode_custom_css.imports": [], "html.autoClosingTags": true, "html.autoCreateQuotes": true, "javascript.autoClosingTags": true, "typescript.autoClosingTags": true, "editor.autoClosingBrackets": "languageDefined", "editor.autoClosingDelete": "auto", "editor.autoClosingOvertype": "auto", "editor.autoClosingQuotes": "languageDefined", "workbench.productIconTheme": "icons-carbon", "workbench.iconTheme": "Monokai Pro (Filter Octagon) Icons", "apc.stylesheet": { ":root": "--header-height: 26px", "body.inline-title-bar .monaco-workbench:not(.fullscreen) .sidebar .composite.title": "background: rgba(0, 0, 0, 0) !important;", ".monaco-workbench .part > .title": "background: rgba(0, 0, 0, 0) !important;", "body.inline-title-bar:not(.activity-bar-at-bottom) .monaco-workbench:not(.fullscreen) .activitybar:not(.right) .activity-bar-placeholder": "background: rgba(0, 0, 0, 0) !important;", ".monaco-list .monaco-list-row": "border-radius: 6px !important;", ".monaco-workbench .part.panel": "box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24) !important;", "#workbench.parts.editor > .content": "border-bottom-left-radius: 6px !important;", ".monaco-workbench .part.panel.bottom .composite.title": "border-top-color: rgba(128, 128, 128, 0) !important;", ".part.editor.has-watermark": "box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24) !important;", ".monaco-workbench .part.editor>.content .editor-group-container>.title .tabs-breadcrumbs .breadcrumbs-control .monaco-icon-label": "font-size: 8px", ".monaco-workbench .part.editor>.content .editor-group-container>.title .tabs-container>.tab .tab-label": "line-height: unset;", ".monaco-icon-label-container .label-name": "font-family: 'SF Pro Display', sans-serif; letter-spacing: -0.5px;", ".tab .monaco-icon-label-container .label-name": "font-family: 'JetBrains Mono', Menlo, monospace; letter-spacing: -0.35px;", ".monaco-list-row .monaco-tl-row .monaco-icon-label-container .label-name": "font-family: 'JetBrains Mono', Menlo, monospace; letter-spacing: -0.1px; font-size: 11px;", ".monaco-pane-view .pane>.pane-header h3.title": "font-weight: 500", ".statusbar .items-container": "font-family: 'JetBrains Mono', sans-serif; letter-spacing: -0.2px; font-size: 8px;", ".monaco-icon-label.italic>.monaco-icon-label-container>.monaco-icon-description-container>.label-description, .monaco-icon-label.italic>.monaco-icon-label-container>.monaco-icon-name-container>.label-name": "font-style: initial;", ".monaco-workbench .part.sidebar .title-actions .action-item": "margin-right: 0px;", "body.inline-title-bar .part>.title>.title-actions .action-label": "min-width: 0px !important; font-size: 12px;", ".monaco-workbench .part > .title > .title-label h2": "display: none", ".monaco-scrollable-element > .shadow.top": "box-shadow: #040606 0 6px 1px -6px inset;", ".monaco-list-row[aria-level='1'] .monaco-tl-twistie.collapsible.collapsed.codicon.codicon-tree-item-expanded": "padding-left: 0px !important", ".monaco-workbench .part.statusbar>.items-container>.statusbar-item.left.first-visible-item": "padding-left: 0;", "body": "border: 1px solid #ffffff1f; border-bottom-left-radius: 10px; box-sizing: border-box;", ".monaco-workbench .part.statusbar": "border-bottom: 2px solid #ffffff1f; border-bottom-left-radius: 9px; border-bottom-right-radius: 10px", ".custom-statusbar .monaco-workbench .part.statusbar .statusbar-item-label": "font-size: 10px;", ".activitybar-bottom.inline-title-bar .monaco-workbench.mac:not(.sidebar-right):not(.fullscreen) .inline-titlebar-placeholder, .inline-title-bar .monaco-workbench.mac.no-activity-bar .inline-titlebar-placeholder": " min-width: 40px;", ".custom-header .monaco-workbench .part.editor>.content .editor-group-container>.title .tabs-container>.tab .tab-label": "line-height: initial; margin: auto 0; padding: 0 12px;", ".custom-header .monaco-workbench .part.editor>.content .editor-group-container>.title div.tabs-container>div.tab": "padding: 0px 4px; opacity: 0.7;", ".custom-header .monaco-workbench .part.editor>.content .editor-group-container>.title div.tabs-container>div.tab.active": "opacity: 1;", ".custom-header .monaco-workbench .part.panel>.composite.title>.panel-switcher-container>div.monaco-action-bar, .custom-header .monaco-workbench .part.editor>.content .editor-group-container>.title div.tabs-container": "padding: 0px", ".custom-header .monaco-workbench .part.editor>.content .editor-group-container>.title .editor-actions": "padding: 0px", ".monaco-workbench .part.editor>.content .editor-group-container>.title .tabs-breadcrumbs .breadcrumbs-control .monaco-breadcrumb-item:before": "width: 16px;", ".monaco-workbench .codicon[class*=codicon-]": "font-size: 10px;", ".codicon-breadcrumb-separator:before": "font-size: 10px; opacity: 0.6", ".monaco-editor .ced-1-TextEditorDecorationType6-4::after": "font-size: 10px;", ".code-hover-contents .rendered-markdown p img": "display: none;", ".custom-statusbar .monaco-workbench .part.statusbar>.items-container>div.statusbar-item span.codicon": "font-size: calc(var(--status-bar-font-size) * 1);", ".monaco-workbench .part.statusbar>.items-container>.statusbar-item>.statusbar-item-label": "padding: 0 8px;", ".editor .decorationsOverviewRuler": "opacity: 0.2", ".monaco-editor .cursor": "background: linear-gradient(to bottom, #ee0979, #ff6a00) !important; box-shadow: 0 0 42px 5px #ee0979, #ff6a00 0px 0px 34px 1px; color: #161616 !important", }, "window.titleBarStyle": "native", "terminal.external.osxExec": "Iterm.app", "animations.Enabled": true, "animations.Install-Method": "Apc Customize UI++", "apc.imports": [ "file:///Users/phen0menon/.vscode/extensions/brandonkirbyson.vscode-animations-2.0.1/dist/updateHandler.js", "/Users/phen0menon/Development/config/custom-js-vscode.js" ], "apc.electron": { "titleBarStyle": "hiddenInset", "trafficLightPosition": { "x": 12, "y": 12 } }, "apc.statusBar": { "position": "bottom", "height": 26, }, "apc.activityBar": { "position": "bottom", "size": 28 }, "apc.listRow": { "height": 20 }, "apc.header": { "fontSize": 10, "height": 30 }, "editor.overviewRulerBorder": false, "color-highlight.markRuler": false, "animations.CursorAnimation": true, "window.restoreFullscreen": true, "window.newWindowDimensions": "maximized", "editor.defaultFormatter": "rvest.vs-code-prettier-eslint", "editor.unicodeHighlight.invisibleCharacters": false, "window.zoomLevel": 1, "git.openRepositoryInParentFolders": "never", "workbench.colorTheme": "Monokai Pro (Filter Octagon)", } ```

[mv-stns]

@mv-stns Yes, just set: "workbench.preferredLightColorTheme": "Xcode Default (Dark Customized Version)" in your settings.json

Not working unfortunately

[sackboy19]

@mv-stns Yes, just set: "workbench.preferredLightColorTheme": "Xcode Default (Dark Customized Version)" in your settings.json

Not working unfortunately

Try this:

"apc.electron": {
    "vibrancy": "dark"
},

instead of vibrancy: "sidebar"

[mv-stns]

Yes @dannylol19 ! It indeed worked with this one 😂 should have thought of this one

[markomitranic]

This extension was the most fun I've had since Myspace!

For some reason that eludes me, I've always been a fan of the old school JetBrains look and color balance, so I tried pursuing that. (Although the settings work mighty fine with other themes as well)

I've also taken some inspiration from the minimalism of Zed and Fleet.

P.S. I couldn't get vibrancy working at all on Sonoma. The opacity works just fine but there is no blur effect applied.

JetBrains Darcula Theme:

Copilot and Terminal screenshots:

Some other popular or built-in themes I've tried with these same settings:

JetBrains Fleet:

Solarized Light:

Visual Studio Dark:

GitHub Light High Contrast:

GitHub Dark Dimmed:

XCode Classic Light:

XCode Classic Dark:

settings.json

```json { // Behaviour START "diffEditor.ignoreTrimWhitespace": false, "editor.formatOnPaste": false, "editor.formatOnSave": true, "security.workspace.trust.untrustedFiles": "open", "terminal.integrated.allowChords": false, "terminal.integrated.macOptionIsMeta": true, "terminal.integrated.defaultProfile.osx": "bash", "workbench.editor.highlightModifiedTabs": true, "outline.collapseItems": "alwaysCollapse", "outline.showVariables": false, "outline.showProperties": false, "typescript.updateImportsOnFileMove.enabled": "never", "javascript.updateImportsOnFileMove.enabled": "never", "explorer.confirmDelete": false, "workbench.editorAssociations": { "git-rebase-todo": "default" }, "explorer.confirmDragAndDrop": false, "workbench.startupEditor": "readme", "editor.inlineSuggest.enabled": true, "terminal.integrated.enableMultiLinePasteWarning": false, "github.copilot.enable": { "*": false, "plaintext": false, "markdown": false, "scminput": false }, // Editor JetBrains Theme START "editor.fontLigatures": true, "editor.fontSize": 14, "editor.lineHeight": 1.6, "editor.fontFamily": "JetBrains Mono, Comic Sans MS", "editor.minimap.enabled": false, "editor.cursorStyle": "block", "editor.cursorBlinking": "smooth", // Terminal macOS Theme START https://glitchbone.github.io/vscode-base16-term/#/eighties "workbench.colorCustomizations": { "terminal.background": "#090909", "terminal.foreground": "#23e169", "terminalCursor.background": "#D3D0C8", "terminalCursor.foreground": "#D3D0C8", "terminal.ansiBlack": "#2D2D2D", "terminal.ansiBlue": "#6699CC", "terminal.ansiBrightBlack": "#747369", "terminal.ansiBrightBlue": "#6699CC", "terminal.ansiBrightCyan": "#66CCCC", "terminal.ansiBrightGreen": "#99CC99", "terminal.ansiBrightMagenta": "#CC99CC", "terminal.ansiBrightRed": "#F2777A", "terminal.ansiBrightWhite": "#F2F0EC", "terminal.ansiBrightYellow": "#FFCC66", "terminal.ansiCyan": "#66CCCC", "terminal.ansiGreen": "#99CC99", "terminal.ansiMagenta": "#CC99CC", "terminal.ansiRed": "#F2777A", "terminal.ansiWhite": "#D3D0C8", "terminal.ansiYellow": "#FFCC66" }, // Window JetBrains Theme START "window.titleBarStyle": "native", "window.commandCenter": false, "workbench.statusBar.visible": false, "apc.menubar.compact": true, "apc.electron": { "frame": false, "titleBarStyle": "hidden" }, "apc.activityBar": { "size": 30, "itemSize": 28, "itemMargin": 2, "position": "bottom", "hideSettings": true }, "apc.header": { "height": 30, "fontSize": 12 }, "apc.listRow": { "fontSize": 12, "height": 22 }, "apc.sidebar.titlebar": { "height": 30, "fontSize": 12 }, "editor.scrollbar.verticalScrollbarSize": 9, "editor.scrollbar.vertical": "visible", "editor.scrollbar.horizontalScrollbarSize": 9, "apc.stylesheet": { ".editor .decorationsOverviewRuler": "display: none !important", "div.visible.scrollbar.vertical .slider": "border-radius: 10px !important; left: -4px !important;", "div.visible.scrollbar.horizontal .slider": "border-radius: 10px !important; top: -4px !important;", ".monaco-breadcrumbs": "font-size: 10px; transform: translateY(0px);", ".monaco-workbench .part > .title > .title-label h2": "display: none", ".activitybar .content .actions-container": "padding-left:1px;", ".activitybar .content .menubar": "display:none", ".activitybar .content .badge .badge-content": "height: 8px!important; width: 8px!important; padding:0!important; top:2px!important; color: transparent!important;" }, "apc.font.family": "JetBrains Mono", "apc.monospace.font.family": "JetBrains Mono", "workbench.iconTheme": "vscode-jetbrains-icon-theme-2023-light", "window.autoDetectColorScheme": true, "workbench.editor.showIcons": false, "workbench.preferredLightColorTheme": "Webstorm IntelliJ Darcula Theme", "workbench.preferredDarkColorTheme": "Webstorm IntelliJ Darcula Theme", "workbench.colorTheme": "Webstorm IntelliJ Darcula Theme" } ```

[mv-stns]

latest update of vscode broke the blur from vibrany, woopsies 😂

settings.json

```json { "terminal.integrated.fontFamily": "Geist Mono", "editor.minimap.enabled": false, "editor.fontFamily": "Geist Mono", "editor.fontSize": 11, "editor.fontWeight": 550, "editor.bracketPairColorization.enabled": true, "editor.indentSize": 2, "editor.roundedSelection": true, "editor.smoothScrolling": true, "editor.cursorSmoothCaretAnimation": "on", "editor.cursorWidth": 1, "editor.cursorBlinking": "phase", "editor.inlayHints.enabled": "off", "editor.glyphMargin": false, "editor.inlayHints.padding": true, "editor.scrollbar.verticalScrollbarSize": 9, "editor.scrollbar.vertical": "visible", "editor.scrollbar.horizontalScrollbarSize": 9, "window.autoDetectColorScheme": true, "workbench.fontAliasing": "default", "window.titleBarStyle": "native", "editor.padding.top": 6, "breadcrumbs.filePath": "on", "editor.guides.indentation": true, "breadcrumbs.enabled": false, "apc.font.family": "Geist Mono", "apc.statusBar": { "height": 32, "fontSize": 12, }, "apc.electron": { "titleBarStyle": "hiddenInset", "trafficLightPosition": { "x": 18, "y": 17 }, "frame": true, "backgroundColor": "rgba(0,0,0,0.5)", "transparent": true, "vibrancy": "ultra-dark" }, "apc.header": { "height": 24, "fontSize": 10, }, "apc.sidebar.titlebar": { "height": 46, "fontSize": 12 }, "apc.activityBar": { "size": 40, "itemSize": 36, "itemMargin": 8, "position": "bottom", "hideSettings": true }, "apc.stylesheet": { "*": "--vscode-list-focusBackground: rgba(246, 201, 159, 0.25)", ".custom-sidebar-titlebar .sidebar .composite.title .title-label": "visibility: hidden;", ".custom-sidebar-titlebar .sidebar .composite.title .title-actions": "padding-left: -100px; padding-top: 2px;", ".monaco-workbench .part.statusbar>.items-container>.statusbar-item.left.first-visible-item": "padding-left: 0;", ".statusbar #status\\.host": "display: block !important; width: calc(var(--activity-bar-action-size) - 1px); background: [#555](https://github.com/lehni/vscode-titlebar-less-macos/issues/555) !important;", ".statusbar #status\\.host .codicon": "margin: 0 auto;", "div.invisible.scrollbar.vertical.fade .slider": "border-radius: 10px !important;", "div.visible.scrollbar.vertical .slider": "border-radius: 10px !important;", "div.invisible.scrollbar.horizontal.fade .slider": "border-radius: 10px !important;", "div.visible.scrollbar.horizontal .slider": "border-radius: 10px !important;", ".monaco-editor .cursors-layer.cursor-block-style .cursor": "transform: translateX(-1px); width: 9px !important; color: transparent; border-width: 1px; border-color: #ffffff8b; border-style: solid; border-radius: 2px; background: #ffffff4b", ".breadcrumbs-control": "height: 18px", ".monaco-breadcrumbs": "font-size: 11px; transform: translateY(0px);", "body": "border: 1px solid #ffffff1f; border-radius: 10px; box-sizing: border-box;", ".monaco-workbench .part.statusbar": "border-bottom: 2px solid #ffffff1f; border-radius: 9px; border-bottom-right-radius: 13.5px", ".monaco-workbench .part.editor[role=main]": "border-right: 1.5px solid #ffffff1f; border-top-right-radius: 12px", ".monaco-workbench .part.panel.basepanel.bottom": "border-right: 2px solid #ffffff1f; border-right-color: #ffffff1f !important;", ".monaco-editor .cursor": "background: linear-gradient(to bottom, #0FAFFF, #4aa6d4) !important; box-shadow: 0 0 42px 5px #0FAFFF, #4aa6d4 0px 0px 34px 1px; color: #161616 !important", ".moco-list-row.focused": "background:rgba(246, 201, 159, 1)", "div#workbench.parts.titlebar": "background-color:rgba(0,0,0,0.5)!important;" }, "workbench.colorCustomizations": { "editorCursor.foreground": "#ffffff8d", "editorBracketMatch.border": "#d9d9d9", "editor.lineHighlightBackground": "#00000000", "editor.lineHighlightBorder": "#00000000", "editorIndentGuide.background1": "#ffffff10", "editorIndentGuide.activeBackground1": "#b4b4b437", "focusBorder": "#00000000", "statusBar.background": "#23232300", "statusBarItem.remoteBackground": "#ffffff00", "statusBar.border": "#ffffff1e", "sash.hoverBorder": "#afafaf00", "editorGroupHeader.border": "#ffffff00", "activityBar.background": "#27272700", "sideBar.background": "#1f1f1f00", "activityBar.border": "#ffffff00", "list.inactiveSelectionBackground": "#ffffff11", "[Xcode Default Dark Customized Version]": { "editorCursor.foreground": "#357bff", "scrollbar.shadow": "#00000000", "editorGroupHeader.border": "#ffffff1c" } }, "editor.overviewRulerBorder": false, "color-highlight.markRuler": false, "animations.CursorAnimation": true, "window.restoreFullscreen": true, "window.newWindowDimensions": "maximized", "symbols.hidesExplorerArrows": false, "extensions.experimental.affinity": { "asvetliakov.vscode-neovim": 1 }, "workbench.iconTheme": "macos-modern-big-sur-icon-theme", "workbench.colorTheme": "Vesper", } ```

[markomitranic]

@drcika can we perhaps pin this thread/issue? Its kinda hard to find in GitHub Issues, and its not referenced in the Readme, but its a really cool thread that helped me learn a lot.

[markomitranic]

I made a sweet little adjustment. I always wanted to try how it feels to swap the order of items in the intellisense popup. Usually, the type of the hovered entity comes first, but sometimes that can take up huge huge scrolls and completely hide the docs of that entity.

{
    ".monaco-hover-content": "display: flex; flex-direction: column;",
    ".monaco-hover-content .hover-row.markdown-hover": "display: block; order: 2;",
    ".monaco-hover-content .hover-row.markdown-hover:has(.rendered-markdown > p)": "order: 1; border-bottom: 1px dashed #4F5254; margin-bottom:6px;"
}

With this change, I've ensured that the docs always come in first, which (for me) makes it quite nice and readable.

[ricewind012]

it's more of a thing of its own, but the extension largely helps in some parts: https://github.com/ricewind012/win95-themes/blob/master/docs/vscode.md preview:

[Aratmany]

"workbench.colorCustomizations": { "editorGroupHeader.tabsBackground": "#00000000", "sideBar.background": "#00000000", "sideBarSectionHeader.background": "#00000000", "editor.background": "#0000001a", "peekViewEditor.background": "#00000000", "peekViewEditorGutter.background": "#00000000", "peekViewTitle.background": "#00000000", "peekViewResult.background": "#00000000", "tab.activeBackground": "#00000000", "tab.inactiveBackground": "#00000000", "statusBar.background": "#00000000", "statusBar.debuggingBackground": "#00000000", "statusBar.noFolderBackground": "#00000000", "statusBarItem.activeBackground": "#00000000", "panel.background": "#00000000", "activityBar.background": "#00000000" }, "window.nativeTabs": true, "editor.minimap.autohide": true, "window.titleBarStyle": "native" "workbench.colorTheme": "Theme Mix", "apc.electron": { "vibrancy": "ultra-dark", "frame": false, "transparent": true, "titleBarStyle": "hiddenInset", "opacity": 0.98, "visualEffectState": "active", "backgroundColor": "#00000000", }

[mubaidr]

My minimalistic setup

Changes

• move sidebar to right
• disable status bar
• cleanup title bar
• disable box shadow everywhere
• disable border radius
• use unified border color for all elements
• de-emphasise line numbers
• simplify tab bar look
• use custom fonts for comments/ suggestions etc

Settings

• Theme: Light Modern
• Font
  • Code: Monaspace Neon
  • Comments/ Hints/ Others: Monaspace Krypton
  • UI: Default Font

Customizations:

"apc.stylesheet": {
    "*": "box-shadow: none!important; filter: none!important; border-radius: 0px!important; border-color: rgba(0,0,0,0.0625)!important; outline: none!important;",
    ".line-numbers": "font-family: Monaspace Krypton ExtraLight!important; font-size: 12px!important;",
    ".monaco-button-dropdown-separator": "background-color: transparent!important",
    ".tab, .titlebar": "border: none!important;",
    ".mtk3": "font-family: Monaspace Radon ExtraLight!important;",
    ".action-item.command-center-quick-pick": "display: none!important;",
    ".monaco-menu-container": "border: 1px solid rgba(0,0,0,0.0625)!important;"
  },
"workbench.colorCustomizations": {
    "activityBar.border": "#ff000000",
    "editorGroupHeader.border": "#ffffff00",
    "editorGroupHeader.tabsBackground": "#f6f8fa00",
    "editorGroupHeader.tabsBorder": "#ff000000",
    "editorInlayHint.background": "#ff000000",
    "editorInlayHint.parameterBackground": "#ff000000",
    "editorInlayHint.typeBackground": "#ff000000",
    "focusBorder": "#ff000000",
    "menu.border": "#d0d7de00",
    "sideBar.border": "#ff000000",
    "tab.activeBackground": "#ff000000",
    "tab.activeBorder": "#ff000000",
    "tab.border": "#ff000000",
    "tab.inactiveBackground": "#ffffff00",
    "titleBar.activeBackground": "#ffffff00",
    "titleBar.border": "#ff000000",
    "widget.border": "#d0d7de"
  },

[mv-stns]

Can you post ur full settings json? thats not enough information The reason:

[mubaidr]

My minimalistic setup

Changes

• move sidebar to right
• disable status bar
• cleanup title bar
• disable box shadow everywhere
• disable border radius
• disable transitions
• use unified border color for all elements
• de-emphasise line numbers
• simplify tab bar look
• use custom fonts for comments/ suggestions etc

Light Mode

Dark Mode

Settings

• Theme: Light Modern/ Dark Modern (works with any theme)
• Font
  • Code: Monaspace Neon
  • Comments/ Hints/ Others: Monaspace Krypton
  • UI: Default Font

Customizations:

"apc.stylesheet": {
    "*": "box-shadow: none!important; filter: none!important; border-radius: 0px!important; border-color: rgba(0,0,0,0.0625)!important; outline: none!important; transition: none !important;",
    ".action-item.command-center-quick-pick": "display: none!important;",
    ".activitybar, .titlebar, .action-item, .sidebar, .title, .monaco-list, .monaco-list-rows, .pane-header, .monaco-count-badge": "background: transparent!important; ",
    ".activitybar.right.bordered": "border-color: transparent!important;",
    ".line-numbers": "font-size: 12px!important; font-weight: 100!important;",
    ".monaco-button-dropdown-separator": "background-color: transparent!important",
    ".monaco-menu-container": "border: 1px solid rgba(0,0,0,0.0625)!important;",
    ".tab": "font-weight: 600!important; border-color: transparent!important;",
    ".monaco-icon-label-container::after": "display: none!important;",
    ".tab, .titlebar": "border: none!important;",
    ".tab-border-bottom-container": "display: none!important;",
    ".tab-border-top-container": "height: 2px!important;",
    ".tabs-container": "margin-bottom: 2em!important;",
    ".title-label": "visibility: hidden!important;",
    ".vs-dark .activitybar, .vs-dark .titlebar, .vs-dark .action-item, .vs-dark .sidebar, .vs-dark .title, .vs-dark .monaco-list, .vs-dark .monaco-list-rows": "background: #1E1E1E!important;"
  },
"workbench.colorCustomizations": {
    "activityBar.border": "#ff000000",
    "editorGroupHeader.border": "#ffffff00",
    "editorGroupHeader.tabsBackground": "#f6f8fa00",
    "editorGroupHeader.tabsBorder": "#ff000000",
    "editorInlayHint.background": "#ff000000",
    "editorInlayHint.parameterBackground": "#ff000000",
    "editorInlayHint.typeBackground": "#ff000000",
    "focusBorder": "#ff000000",
    "menu.border": "#d0d7de00",
    "sideBar.border": "#ff000000",
    "tab.activeBackground": "#ff000000",
    "tab.activeBorder": "#ff000000",
    "tab.border": "#ff000000",
    "tab.inactiveBackground": "#ffffff00",
    "titleBar.activeBackground": "#ffffff00",
    "titleBar.border": "#ff000000",
    "widget.border": "#d0d7de",
    "[Default Light Modern]": {
      "editor.background": "#f8f8f8"
    }
  },

[syahbes]

👍 nice

[mubaidr]

For anyone interested, I have published the theme to Vscode Marketplace: Minimal Mist

[EliTheSurfer]

Here is mine. You can find the dotfiles here. I can't thank you enough for this amazing extension 🫶 .

Welcome page

Command palette

Transparency