More Themes

Color themes

• 

  Coding Night

• 

  Doom Vibes

• 

  Fallout Vibes

• 

  Pink Party

VS Code preview

Full workbench mockup using this variant's colors and tokenColors.

Loading...

colors

Workbench UI color keys from the theme JSON colors map.

• activityBar.background#2b1a1a
• activityBar.foreground#e0e0e0
• activityBarBadge.background#ff4d4d
• activityBarBadge.foreground#1a0e0e
• button.background#ff4d4d
• button.foreground#1a0e0e
• button.hoverBackground#ff6666
• commandCenter.activeBackground#3b1f1f
• commandCenter.activeForeground#ffffff
• commandCenter.background#2b1a1a
• commandCenter.border#1a0e0e
• commandCenter.foreground#e0e0e0
• diffEditor.insertedTextBackground#50fa7b33
• diffEditor.removedTextBackground#ff1a1a33
• dropdown.background#2b1a1a
• dropdown.foreground#ffffff
• editor.background#1a0e0e
• editor.findMatchBackground#ffae4266
• editor.findMatchHighlightBackground#ffae4233
• editor.foreground#e0e0e0
• editor.inactiveSelectionBackground#6e2e2e40
• editor.lineHighlightBackground#2b1a1a80
• editor.selectionBackground#6e2e2e80
• editor.wordHighlightBackground#da70d622
• editor.wordHighlightStrongBackground#da70d644
• editorBracketMatch.border#da70d6
• editorCursor.foreground#ff4d4d
• editorError.foreground#ff1a1a
• editorGroup.border#1a0e0e
• editorGroupHeader.noTabsBackground#1a0e0e
• editorGroupHeader.tabsBackground#1a0e0e
• editorGroupHeader.tabsBorder#1a0e0e
• editorHoverWidget.background#2b1a1a
• editorIndentGuide.activeBackground1#ff4d4d
• editorIndentGuide.background1#3b3b3b
• editorLineNumber.activeForeground#ffffff
• editorLineNumber.foreground#6e2e2e
• editorSuggestWidget.background#2b1a1a
• editorSuggestWidget.highlightForeground#ffae42
• editorSuggestWidget.selectedBackground#3b1f1f
• editorWarning.foreground#ffae42
• editorWhitespace.foreground#3b3b3b
• icon.foreground#e0e0e0
• input.background#3b1f1f
• input.foreground#ffffff
• input.placeholderForeground#a0a0a0
• inputOption.activeBorder#ff4d4d
• list.activeSelectionBackground#4d2a2a
• list.activeSelectionForeground#ffffff
• list.hoverBackground#3b1f1f
• menu.background#2b1a1a
• menu.foreground#e0e0e0
• menu.selectionBackground#3b1f1f
• menu.selectionForeground#ffffff
• panel.background#2b1a1a
• panel.border#1a0e0e
• panelTitle.activeBorder#ff4d4d
• panelTitle.activeForeground#ffffff
• panelTitle.inactiveForeground#a0a0a0
• quickInput.background#2b1a1a
• quickInput.foreground#ffffff
• quickInputList.focusBackground#3b1f1f
• quickInputList.focusForeground#ffffff
• scrollbarSlider.activeBackground#4d2a2ad0
• scrollbarSlider.background#4d2a2a80
• scrollbarSlider.hoverBackground#4d2a2ab0
• sideBar.background#2b1a1a
• sideBar.foreground#e0e0e0
• sideBarSectionHeader.background#2b1a1a
• sideBarSectionHeader.foreground#ffffff
• statusBar.background#2b1a1a
• statusBar.debuggingBackground#ff1a1a
• statusBar.debuggingForeground#1a0e0e
• statusBar.foreground#e0e0e0
• tab.activeBackground#1a0e0e
• tab.activeBorder#ff4d4d
• tab.activeForeground#ffffff
• tab.inactiveBackground#2b1a1a
• tab.inactiveForeground#a0a0a0
• terminal.background#1a0e0e
• terminal.foreground#e0e0e0
• terminalCursor.foreground#ff4d4d
• titleBar.activeBackground#1a0e0e
• titleBar.activeForeground#e0e0e0
• titleBar.inactiveBackground#2b1a1a
• titleBar.inactiveForeground#a0a0a0
• toolbar.activeBackground#4d2a2a
• toolbar.hoverBackground#3b1f1f

tokenColors

TextMate scopes and font styles (syntax highlighting rules).