Zenith Color Theme

Color themes

• 

  Zenith Midnight

• 

  Zenith Ocean

• 

  Zenith Rosé

• 

  Zenith Zen

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.activeBackground#00000000
• activityBar.activeBorder#00000000
• activityBar.activeFocusBorder#00000000
• activityBar.background#0f0f14
• activityBar.border#00000000
• activityBar.dropBorder#00000000
• activityBar.foreground#e8e8f0
• activityBar.inactiveForeground#41414b
• activityBarBadge.background#c8b8ff
• activityBarBadge.foreground#0f0f14
• badge.background#c8b8ff
• badge.foreground#0f0f14
• breadcrumb.activeSelectionForeground#c8b8ff
• breadcrumb.background#0f0f14
• breadcrumb.focusForeground#e8e8f0
• breadcrumb.foreground#50505a
• breadcrumbPicker.background#19191e
• button.background#c8b8ff
• button.foreground#0f0f14
• button.hoverBackground#c8b8ffdd
• button.secondaryBackground#1e1e23
• button.secondaryForeground#e8e8f0
• button.secondaryHoverBackground#19191e
• checkbox.background#19191e
• checkbox.border#00000000
• checkbox.foreground#e8e8f0
• descriptionForeground#50505a
• disabledForeground#41414b
• dropdown.background#19191e
• dropdown.border#00000000
• dropdown.foreground#e8e8f0
• dropdown.listBackground#19191e
• editor.background#0f0f14
• editor.findMatchBackground#c8b8ff50
• editor.findMatchBorder#c8b8ff
• editor.findMatchHighlightBackground#c8b8ff25
• editor.findMatchHighlightBorder#00000000
• editor.findRangeHighlightBackground#23232840
• editor.findRangeHighlightBorder#00000000
• editor.foreground#e8e8f0
• editor.hoverHighlightBackground#23232840
• editor.inactiveSelectionBackground#c8b8ff30
• editor.lineHighlightBackground#19191e
• editor.lineHighlightBorder#00000000
• editor.rangeHighlightBackground#23232840
• editor.rangeHighlightBorder#00000000
• editor.selectionBackground#c8b8ff40
• editor.selectionHighlightBackground#c8b8ff25
• editor.selectionHighlightBorder#00000000
• editor.wordHighlightBackground#99b8ff25
• editor.wordHighlightBorder#99b8ff60
• editor.wordHighlightStrongBackground#99b8ff35
• editor.wordHighlightStrongBorder#99b8ff80
• editorBracketMatch.background#c8b8ff25
• editorBracketMatch.border#c8b8ff80
• editorCodeLens.foreground#50505a
• editorCursor.background#0f0f14
• editorCursor.foreground#c8b8ff
• editorError.border#00000000
• editorError.foreground#ff99b8
• editorGroup.border#00000000
• editorGroup.dropBackground#23232840
• editorGroupHeader.border#00000000
• editorGroupHeader.noTabsBackground#0f0f14
• editorGroupHeader.tabsBackground#0f0f14
• editorGroupHeader.tabsBorder#00000000
• editorGutter.addedBackground#b8ffc8
• editorGutter.background#0f0f14
• editorGutter.commentRangeForeground#32323c
• editorGutter.deletedBackground#ff99b8
• editorGutter.foldingControlForeground#50505a
• editorGutter.modifiedBackground#99b8ff
• editorHint.border#00000000
• editorHint.foreground#c8b8ff
• editorHoverWidget.background#19191e
• editorHoverWidget.border#c8b8ff60
• editorHoverWidget.foreground#e8e8f0
• editorHoverWidget.statusBarBackground#141419
• editorIndentGuide.activeBackground#c8b8ff60
• editorIndentGuide.background#50505a40
• editorInfo.border#00000000
• editorInfo.foreground#99b8ff
• editorLineNumber.activeForeground#c8b8ff
• editorLineNumber.foreground#32323c
• editorLink.activeForeground#99b8ff
• editorOverviewRuler.addedForeground#b8ffc8
• editorOverviewRuler.border#00000000
• editorOverviewRuler.bracketMatchForeground#88a8ff
• editorOverviewRuler.deletedForeground#ff99b8
• editorOverviewRuler.errorForeground#ff99b8
• editorOverviewRuler.infoForeground#99b8ff
• editorOverviewRuler.modifiedForeground#99b8ff
• editorOverviewRuler.warningForeground#fff0b8
• editorRuler.foreground#32323c60
• editorSuggestWidget.background#19191e
• editorSuggestWidget.border#c8b8ff60
• editorSuggestWidget.foreground#e8e8f0
• editorSuggestWidget.highlightForeground#c8b8ff
• editorSuggestWidget.selectedBackground#c8b8ff30
• editorWarning.border#00000000
• editorWarning.foreground#fff0b8
• editorWhitespace.foreground#50505a50
• editorWidget.background#19191e
• editorWidget.border#c8b8ff60
• editorWidget.foreground#e8e8f0
• errorForeground#ff99b8
• extensionButton.prominentBackground#c8b8ff
• extensionButton.prominentForeground#0f0f14
• extensionButton.prominentHoverBackground#c8b8ffdd
• focusBorder#00000000
• foreground#e8e8f0
• gitDecoration.conflictingResourceForeground#ffb888
• gitDecoration.deletedResourceForeground#ff99b8
• gitDecoration.ignoredResourceForeground#50505a
• gitDecoration.modifiedResourceForeground#99b8ff
• gitDecoration.submoduleResourceForeground#c8b8ff
• gitDecoration.untrackedResourceForeground#b8ffc8
• icon.foreground#c8b8ff
• input.background#19191e
• input.border#00000000
• input.foreground#e8e8f0
• input.placeholderForeground#50505a
• inputOption.activeBackground#23232880
• inputOption.activeBorder#00000000
• inputOption.activeForeground#e8e8f0
• inputValidation.errorBackground#19191e
• inputValidation.errorBorder#ff99b8
• inputValidation.errorForeground#ff99b8
• inputValidation.infoBackground#19191e
• inputValidation.infoBorder#99b8ff
• inputValidation.infoForeground#99b8ff
• inputValidation.warningBackground#19191e
• inputValidation.warningBorder#fff0b8
• inputValidation.warningForeground#fff0b8
• list.activeSelectionBackground#c8b8ff35
• list.activeSelectionForeground#e8e8f0
• list.dropBackground#23232840
• list.errorForeground#ff99b8
• list.focusBackground#c8b8ff30
• list.focusForeground#e8e8f0
• list.highlightForeground#c8b8ff
• list.hoverBackground#19191e80
• list.hoverForeground#e8e8f0
• list.inactiveSelectionBackground#c8b8ff20
• list.inactiveSelectionForeground#e8e8f0
• list.invalidItemForeground#ff99b8
• list.warningForeground#fff0b8
• listFilterWidget.background#19191e
• listFilterWidget.noMatchesOutline#ff99b8
• listFilterWidget.outline#00000000
• menu.background#19191e
• menu.border#00000000
• menu.foreground#e8e8f0
• menu.selectionBackground#c8b8ff40
• menu.selectionForeground#e8e8f0
• menu.separatorBackground#232328
• menubar.selectionBackground#23232840
• menubar.selectionForeground#e8e8f0
• minimap.errorHighlight#ff99b8
• minimap.findMatchHighlight#fff0b840
• minimap.selectionHighlight#23232880
• minimap.warningHighlight#fff0b8
• minimapGutter.addedBackground#b8ffc8
• minimapGutter.deletedBackground#ff99b8
• minimapGutter.modifiedBackground#99b8ff
• notificationCenter.border#00000000
• notificationCenterHeader.background#19191e
• notificationCenterHeader.foreground#e8e8f0
• notificationLink.foreground#99b8ff
• notifications.background#19191e
• notifications.border#00000000
• notifications.foreground#e8e8f0
• notificationsErrorIcon.foreground#ff99b8
• notificationsInfoIcon.foreground#99b8ff
• notificationsWarningIcon.foreground#fff0b8
• notificationToast.border#00000000
• panel.background#0f0f14
• panel.border#1e1e23
• panelTitle.activeBorder#c8b8ff
• panelTitle.activeForeground#e8e8f0
• panelTitle.inactiveForeground#50505a
• peekView.border#c8b8ff
• peekViewEditor.background#19191e
• peekViewEditor.matchHighlightBackground#fff0b840
• peekViewResult.background#19191e
• peekViewResult.fileForeground#e8e8f0
• peekViewResult.lineForeground#50505a
• peekViewResult.matchHighlightBackground#fff0b840
• peekViewResult.selectionBackground#c8b8ff40
• peekViewResult.selectionForeground#e8e8f0
• peekViewTitle.background#1e1e23
• peekViewTitleDescription.foreground#50505a
• peekViewTitleLabel.foreground#e8e8f0
• progressBar.background#c8b8ff
• sash.hoverBorder#00000000
• scrollbar.shadow#0f0f1440
• scrollbarSlider.activeBackground#c8b8ff60
• scrollbarSlider.background#32323c40
• scrollbarSlider.hoverBackground#32323c60
• search.resultsInfoForeground#e8e8f0
• searchEditor.findMatchBackground#c8b8ff50
• searchEditor.findMatchBorder#c8b8ff
• searchEditor.textInputBorder#00000000
• selection.background#232328
• settings.checkboxBackground#19191e
• settings.checkboxBorder#00000000
• settings.checkboxForeground#e8e8f0
• settings.dropdownBackground#19191e
• settings.dropdownBorder#00000000
• settings.dropdownForeground#e8e8f0
• settings.dropdownListBorder#00000000
• settings.headerForeground#e8e8f0
• settings.modifiedItemIndicator#99b8ff
• settings.numberInputBackground#19191e
• settings.numberInputBorder#00000000
• settings.numberInputForeground#e8e8f0
• settings.textInputBackground#19191e
• settings.textInputBorder#00000000
• settings.textInputForeground#e8e8f0
• sideBar.background#0f0f14
• sideBar.border#00000000
• sideBar.foreground#e8e8f0
• sideBarSectionHeader.background#00000000
• sideBarSectionHeader.border#00000000
• sideBarSectionHeader.foreground#e8e8f0
• sideBarTitle.foreground#e8e8f0
• statusBar.background#141419
• statusBar.border#00000000
• statusBar.debuggingBackground#ffb888
• statusBar.debuggingBorder#00000000
• statusBar.debuggingForeground#0f0f14
• statusBar.foreground#e8e8f0
• statusBar.noFolderBackground#141419
• statusBar.noFolderBorder#00000000
• statusBar.noFolderForeground#e8e8f0
• statusBarItem.activeBackground#c8b8ff40
• statusBarItem.hoverBackground#23232840
• statusBarItem.prominentBackground#c8b8ff
• statusBarItem.prominentForeground#0f0f14
• statusBarItem.prominentHoverBackground#c8b8ffdd
• statusBarItem.remoteBackground#c8b8ff
• statusBarItem.remoteForeground#0f0f14
• tab.activeBackground#0f0f14
• tab.activeBorder#00000000
• tab.activeBorderTop#c8b8ff
• tab.activeForeground#e8e8f0
• tab.activeModifiedBorder#99b8ff
• tab.border#00000000
• tab.hoverBackground#19191e
• tab.hoverBorder#00000000
• tab.hoverForeground#e8e8f0
• tab.inactiveBackground#0f0f14
• tab.inactiveForeground#50505a
• tab.inactiveModifiedBorder#99b8ff80
• tab.unfocusedActiveBorder#00000000
• tab.unfocusedActiveBorderTop#41414b
• tab.unfocusedActiveForeground#50505a
• tab.unfocusedActiveModifiedBorder#99b8ff60
• tab.unfocusedHoverBackground#19191e
• tab.unfocusedHoverBorder#00000000
• tab.unfocusedHoverForeground#e8e8f0
• tab.unfocusedInactiveForeground#41414b
• tab.unfocusedInactiveModifiedBorder#99b8ff40
• terminal.ansiBlack#0f0f14
• terminal.ansiBlue#99b8ff
• terminal.ansiBrightBlack#32323c
• terminal.ansiBrightBlue#88a8ff
• terminal.ansiBrightCyan#a8e8f0
• terminal.ansiBrightGreen#c8ffd8
• terminal.ansiBrightMagenta#b8a8f5
• terminal.ansiBrightRed#ff99b8
• terminal.ansiBrightWhite#e8e8f0
• terminal.ansiBrightYellow#fff0b8
• terminal.ansiCyan#b8f0ff
• terminal.ansiGreen#b8ffc8
• terminal.ansiMagenta#c8b8ff
• terminal.ansiRed#ff99b8
• terminal.ansiWhite#e8e8f0
• terminal.ansiYellow#fff0b8
• terminal.background#0f0f14
• terminal.foreground#e8e8f0
• terminal.selectionBackground#c8b8ff40
• terminalCursor.background#0f0f14
• terminalCursor.foreground#c8b8ff
• textBlockQuote.background#19191e
• textBlockQuote.border#00000000
• textCodeBlock.background#19191e
• textLink.activeForeground#88a8ff
• textLink.foreground#99b8ff
• textPreformat.foreground#e8e8f0
• textSeparator.foreground#00000000
• titleBar.activeBackground#0f0f14
• titleBar.activeForeground#e8e8f0
• titleBar.border#00000000
• titleBar.inactiveBackground#0f0f14
• titleBar.inactiveForeground#50505a
• toolbar.activeBackground#c8b8ff40
• toolbar.hoverBackground#23232840
• tree.indentGuidesStroke#32323c
• welcomePage.background#0f0f14
• welcomePage.buttonBackground#19191e
• welcomePage.buttonHoverBackground#1e1e23
• widget.shadow#0f0f1440
• window.activeBorder#00000000
• window.inactiveBorder#00000000

tokenColors

TextMate scopes and font styles (syntax highlighting rules).