Zenbones Themes

Color themes

• 

  Zenbones Light Bright

• 

  Zenbones Light Dim

• 

  Zenbones Neobones Dark

• 

  Zenbones Neobones Dark Stark

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#1A2A33
• activityBar.foreground#C6D5CF
• activityBarBadge.background#B279A7
• activityBarBadge.foreground#121F27
• badge.background#B279A7
• badge.foreground#121F27
• button.background#1A2A33
• button.foreground#C6D5CF
• button.secondaryBackground#121F27
• button.secondaryForeground#D1E0DA
• checkbox.background#1A2A33
• checkbox.foreground#C6D5CF
• descriptionForeground#C6D5CF
• disabledForeground#C6D5CF80
• editor.background#091217
• editor.findMatchBackground#B982AD
• editor.findMatchHighlightBackground#593B53
• editor.foreground#C6D5CF
• editor.lineHighlightBackground#101B22
• editor.selectionBackground#343836
• editorBracketHighlight.foreground1#8190D4
• editorBracketHighlight.foreground2#90FF6B
• editorBracketHighlight.foreground3#B279A7
• editorBracketHighlight.foreground4#8190D4
• editorBracketHighlight.foreground5#90FF6B
• editorBracketHighlight.foreground6#B279A7
• editorBracketHighlight.unexpectedBracket.foreground#DE6E7C
• editorCursor.foreground#CEDDD7
• editorError.foreground#DE6E7C
• editorGroupHeader.tabsBackground#121F27
• editorGutter.addedBackground#172514
• editorGutter.deletedBackground#331B1D
• editorGutter.modifiedBackground#19203B
• editorHint.foreground#B279A7
• editorHoverWidget.background#192830
• editorHoverWidget.border#2A404D
• editorHoverWidget.foreground#C6D5CF
• editorIndentGuide.activeBackground#3F5D6Fa0
• editorIndentGuide.background#3F5D6F50
• editorInfo.foreground#8190D4
• editorLineNumber.activeForeground#C6D5CF
• editorLineNumber.foreground#3F5D6F
• editorOverviewRuler.addedForeground#172514
• editorOverviewRuler.deletedForeground#331B1D
• editorOverviewRuler.errorForeground#DE6E7C
• editorOverviewRuler.findMatchForeground#593B53
• editorOverviewRuler.infoForeground#8190D4
• editorOverviewRuler.modifiedForeground#19203B
• editorOverviewRuler.selectionHighlightForeground#343836
• editorOverviewRuler.warningForeground#B77E64
• editorRuler.foreground#3F5D6Fa0
• editorWarning.foreground#B77E64
• editorWidget.background#121F27
• editorWidget.border#1A2A33
• editorWidget.foreground#D1E0DA
• errorForeground#DE6E7C
• focusBorder#B279A7
• foreground#C6D5CF
• icon.foreground#C6D5CFa0
• input.background#091217
• input.foreground#C6D5CF
• input.placeholderForeground#4D6472
• inputOption.activeBorder#B279A7
• inputValidation.errorBorder#DE6E7C
• inputValidation.infoBorder#8190D4
• inputValidation.warningBorder#B77E64
• keybindingLabel.background#1A2A33
• keybindingLabel.border#192830
• keybindingLabel.bottomBorder#2A404D
• keybindingLabel.foreground#C6D5CF
• list.activeSelectionBackground#2A404D
• list.activeSelectionForeground#C6D5CF
• list.highlightForeground#B279A7
• list.hoverBackground#2A404D50
• list.inactiveSelectionBackground#2A404Da0
• minimap.errorHighlight#DE6E7C
• minimap.findMatchHighlight#593B53
• minimap.selectionHighlight#343836
• minimap.warningHighlight#B77E64
• minimapGutter.addedBackground#172514
• minimapGutter.deletedBackground#331B1D
• minimapGutter.modifiedBackground#19203B
• notificationCenterHeader.background#121F27
• notificationCenterHeader.foreground#D1E0DA
• notificationLink.foreground#B279A7
• notifications.background#091217
• notifications.foreground#C6D5CF
• notificationsErrorIcon.foreground#DE6E7C
• notificationsInfoIcon.foreground#8190D4
• notificationsWarningIcon.foreground#B77E64
• panel.background#091217
• panel.border#3F5D6Fa0
• panelTitle.activeBorder#3F5D6Fa0
• panelTitle.activeForeground#C6D5CF
• panelTitle.inactiveForeground#C6D5CFa0
• pickerGroup.border#3F5D6Fa0
• pickerGroup.foreground#D1E0DA
• problemsErrorIcon.foreground#DE6E7C
• problemsInfoIcon.foreground#8190D4
• problemsWarningIcon.foreground#B77E64
• quickInput.background#121F27
• quickInput.foreground#D1E0DA
• quickInputList.focusBackground#1A2A33
• quickInputList.focusForeground#C6D5CF
• scrollbar.shadow#1A2A33
• scrollbarSlider.activeBackground#3A5666
• scrollbarSlider.background#192830
• scrollbarSlider.hoverBackground#2A404D
• selection.background#343836
• sideBar.background#121F27
• sideBar.foreground#D1E0DA
• sideBarSectionHeader.background#1A2A33
• sideBarSectionHeader.foreground#C6D5CF
• statusBar.background#121F27
• statusBar.debuggingBackground#121F27
• statusBar.foreground#D1E0DA
• statusBar.noFolderBackground#121F27
• statusBarItem.remoteBackground#1A2A33
• statusBarItem.remoteForeground#C6D5CF
• tab.activeBackground#091217
• tab.activeForeground#C6D5CF
• tab.border#121F27
• tab.inactiveBackground#1A2A33
• tab.inactiveForeground#C6D5CFa0
• terminal.ansiBlack#0F191F
• terminal.ansiBlue#8190D4
• terminal.ansiBrightBlack#263945
• terminal.ansiBrightBlue#92A0E2
• terminal.ansiBrightCyan#65B8C1
• terminal.ansiBrightGreen#A0FF85
• terminal.ansiBrightMagenta#CF86C1
• terminal.ansiBrightRed#E8838F
• terminal.ansiBrightWhite#98A39E
• terminal.ansiBrightYellow#D68C67
• terminal.ansiCyan#66A5AD
• terminal.ansiGreen#90FF6B
• terminal.ansiMagenta#B279A7
• terminal.ansiRed#DE6E7C
• terminal.ansiWhite#C6D5CF
• terminal.ansiYellow#B77E64
• terminalCursor.background#091217
• terminalCursor.foreground#CEDDD7
• textLink.activeForeground#B279A7d0
• textLink.foreground#B279A7
• widget.shadow#1A2A33
• window.activeBorder#B279A7
• window.inactiveBorder#C6D5CF

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

Shiki preview

TypeScript sample highlighted with this variant's colors and tokenColors.

Loading...