ThemeDatabase All Themes

Color themes

• 

  Xenus-Horizon

• 

  Xeon Light

• 

  X Frankfurt

• 

  XFRI Dark Theme

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#1A1A1A
• activityBarBadge.background#FFD700
• activityBarBadge.foreground#121212
• breadcrumb.activeSelectionForeground#FFA500
• breadcrumb.background#1E1E1E
• breadcrumb.border#2A2A2A
• breadcrumb.focusForeground#FFD700
• breadcrumb.foreground#FFA500
• breadcrumb.hoverForeground#FF8C00
• debugToolBar.background#121212
• debugToolBar.border#FF8C00
• debugToolBarItem.background#1A1A1A
• debugToolBarItem.hoverBackground#2A2A2A
• diffEditor.insertedTextBackground#4CAF50
• diffEditor.modifiedTextBackground#FFD700
• diffEditor.removedTextBackground#F44336
• editor.background#121212
• editor.findMatchHighlightBackground#4D4D4D
• editor.foreground#FFA500
• editor.selectionBackground#3D3D3D
• editor.selectionHighlightBackground#3D3D3D
• editorBracketMatch.background#3D3D3D
• editorBracketMatch.border#FFD700
• editorCursor.foreground#FFD700
• editorGroup.border#2A2A2A
• editorGroupHeader.border#FFA500
• editorGroupHeader.tabsBackground#121212
• editorGutter.addedBackground#4CAF50
• editorGutter.deletedBackground#F44336
• editorGutter.modifiedBackground#FFD700
• editorIndentGuide.background#2A2A2A
• editorLineNumber.foreground#FF8C00
• editorLink.activeForeground#FFD700
• editorLink.hoverForeground#FF8C00
• editorRuler.foreground#2A2A2A
• editorSuggestWidget.background#1E1E1E
• editorSuggestWidget.foreground#FFA500
• editorSuggestWidget.highlightForeground#FFD700
• editorSuggestWidget.selectedBackground#2A2A2A
• editorSuggestWidget.selectedForeground#FFA500
• editorSuggestWidgetBorder#2A2A2A
• editorSuggestWidgetStatusBar.background#1A1A1A
• editorSuggestWidgetStatusBar.border#2A2A2A
• editorSuggestWidgetStatusBar.foreground#FFA500
• editorUnnecessaryCode.border#FF8C00
• editorUnnecessaryCodeOpacity#121212
• editorWhitespace.foreground#2A2A2A
• icon.activityBarForeground#FFA500
• icon.foreground#FFA500
• icon.titleBarForeground#FFA500
• notifications.background#1A1A1A
• notifications.foreground#FFA500
• panel.background#121212
• panel.border#2A2A2A
• panelTitle.activeBorder#FFD700
• panelTitle.activeForeground#FFA500
• panelTitle.inactiveForeground#FF8C00
• scrollbar.shadow#00000080
• scrollbarSlider.activeBackground#FFA500
• scrollbarSlider.background#2A2A2A
• scrollbarSlider.hoverBackground#3D3D3D
• searchEditor.resultsFileHighlightBackground#2A2A2A
• searchEditor.resultsFileHighlightBorder#FF8C00
• searchEditor.resultsHighlightBackground#3D3D3D
• searchEditor.resultsHighlightBorder#1E1E1E
• searchEditor.textInputBackground#1A1A1A
• searchEditor.textInputForeground#FFA500
• sideBar.background#1E1E1E
• sideBarTitle.foreground#FFA500
• statusBar.background#1A1A1A
• statusBar.debuggingBackground#2A2A2A
• statusBar.debuggingForeground#FFA500
• statusBar.foreground#FFA500
• statusBar.noFolderBackground#1A1A1A
• statusBar.noFolderForeground#FFA500
• statusBarItem.activeBackground#3D3D3D
• statusBarItem.hoverBackground#4D4D4D
• statusBarItem.prominentBackground#3D3D3D
• statusBarItem.prominentForeground#FFA500
• terminal.background#121212
• terminal.foreground#FFA500
• titleBar.activeBackground#1A1A1A
• titleBar.activeForeground#FFA500
• titleBar.inactiveBackground#121212
• titleBar.inactiveForeground#FF8C00
• titleBar.remoteBackground#1A1A1A
• titleBar.remoteForeground#FFA500

tokenColors

TextMate scopes and font styles (syntax highlighting rules).