Zenbones Themes

Color themes

• 

  Zenbones Zenwritten Dark Stark

• 

  Zenbones Zenwritten Dark Warm

• 

  Zenbones Zenwritten Light

• 

  Zenbones Zenwritten Light Bright

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#302829
• activityBar.foreground#BBBBBB
• activityBarBadge.background#B279A7
• activityBarBadge.foreground#241E1F
• badge.background#B279A7
• badge.foreground#241E1F
• button.background#302829
• button.foreground#BBBBBB
• button.secondaryBackground#241E1F
• button.secondaryForeground#CFCFCF
• checkbox.background#302829
• checkbox.foreground#BBBBBB
• descriptionForeground#BBBBBB
• disabledForeground#BBBBBB80
• editor.background#171213
• editor.findMatchBackground#BA85AF
• editor.findMatchHighlightBackground#5C3D56
• editor.foreground#BBBBBB
• editor.lineHighlightBackground#201A1B
• editor.selectionBackground#393939
• editorBracketHighlight.foreground1#6099C0
• editorBracketHighlight.foreground2#819B69
• editorBracketHighlight.foreground3#B279A7
• editorBracketHighlight.foreground4#6099C0
• editorBracketHighlight.foreground5#819B69
• editorBracketHighlight.foreground6#B279A7
• editorBracketHighlight.unexpectedBracket.foreground#DE6E7C
• editorCursor.foreground#C9C9C9
• editorError.foreground#DE6E7C
• editorGroupHeader.tabsBackground#241E1F
• editorGutter.addedBackground#1E2616
• editorGutter.deletedBackground#361C1F
• editorGutter.modifiedBackground#18252F
• editorHint.foreground#B279A7
• editorHoverWidget.background#2B2425
• editorHoverWidget.border#483D3F
• editorHoverWidget.foreground#BBBBBB
• editorIndentGuide.activeBackground#67585Ba0
• editorIndentGuide.background#67585B50
• editorInfo.foreground#6099C0
• editorLineNumber.activeForeground#BBBBBB
• editorLineNumber.foreground#67585B
• editorOverviewRuler.addedForeground#1E2616
• editorOverviewRuler.deletedForeground#361C1F
• editorOverviewRuler.errorForeground#DE6E7C
• editorOverviewRuler.findMatchForeground#5C3D56
• editorOverviewRuler.infoForeground#6099C0
• editorOverviewRuler.modifiedForeground#18252F
• editorOverviewRuler.selectionHighlightForeground#393939
• editorOverviewRuler.warningForeground#B77E64
• editorRuler.foreground#67585Ba0
• editorWarning.foreground#B77E64
• editorWidget.background#241E1F
• editorWidget.border#302829
• editorWidget.foreground#CFCFCF
• errorForeground#DE6E7C
• focusBorder#B279A7
• foreground#BBBBBB
• icon.foreground#BBBBBBa0
• input.background#171213
• input.foreground#BBBBBB
• input.placeholderForeground#6C6062
• inputOption.activeBorder#B279A7
• inputValidation.errorBorder#DE6E7C
• inputValidation.infoBorder#6099C0
• inputValidation.warningBorder#B77E64
• keybindingLabel.background#302829
• keybindingLabel.border#2B2425
• keybindingLabel.bottomBorder#483D3F
• keybindingLabel.foreground#BBBBBB
• list.activeSelectionBackground#483D3F
• list.activeSelectionForeground#BBBBBB
• list.highlightForeground#B279A7
• list.hoverBackground#483D3F50
• list.inactiveSelectionBackground#483D3Fa0
• minimap.errorHighlight#DE6E7C
• minimap.findMatchHighlight#5C3D56
• minimap.selectionHighlight#393939
• minimap.warningHighlight#B77E64
• minimapGutter.addedBackground#1E2616
• minimapGutter.deletedBackground#361C1F
• minimapGutter.modifiedBackground#18252F
• notificationCenterHeader.background#241E1F
• notificationCenterHeader.foreground#CFCFCF
• notificationLink.foreground#B279A7
• notifications.background#171213
• notifications.foreground#BBBBBB
• notificationsErrorIcon.foreground#DE6E7C
• notificationsInfoIcon.foreground#6099C0
• notificationsWarningIcon.foreground#B77E64
• panel.background#171213
• panel.border#67585Ba0
• panelTitle.activeBorder#67585Ba0
• panelTitle.activeForeground#BBBBBB
• panelTitle.inactiveForeground#BBBBBBa0
• pickerGroup.border#67585Ba0
• pickerGroup.foreground#CFCFCF
• problemsErrorIcon.foreground#DE6E7C
• problemsInfoIcon.foreground#6099C0
• problemsWarningIcon.foreground#B77E64
• quickInput.background#241E1F
• quickInput.foreground#CFCFCF
• quickInputList.focusBackground#302829
• quickInputList.focusForeground#BBBBBB
• scrollbar.shadow#302829
• scrollbarSlider.activeBackground#5F5154
• scrollbarSlider.background#2B2425
• scrollbarSlider.hoverBackground#483D3F
• selection.background#393939
• sideBar.background#241E1F
• sideBar.foreground#CFCFCF
• sideBarSectionHeader.background#302829
• sideBarSectionHeader.foreground#BBBBBB
• statusBar.background#241E1F
• statusBar.debuggingBackground#241E1F
• statusBar.foreground#CFCFCF
• statusBar.noFolderBackground#241E1F
• statusBarItem.remoteBackground#302829
• statusBarItem.remoteForeground#BBBBBB
• tab.activeBackground#171213
• tab.activeForeground#BBBBBB
• tab.border#241E1F
• tab.inactiveBackground#302829
• tab.inactiveForeground#BBBBBBa0
• terminal.ansiBlack#191919
• terminal.ansiBlue#6099C0
• terminal.ansiBrightBlack#3D3839
• terminal.ansiBrightBlue#61ABDA
• terminal.ansiBrightCyan#65B8C1
• terminal.ansiBrightGreen#8BAE68
• terminal.ansiBrightMagenta#CF86C1
• terminal.ansiBrightRed#E8838F
• terminal.ansiBrightWhite#8E8E8E
• terminal.ansiBrightYellow#D68C67
• terminal.ansiCyan#66A5AD
• terminal.ansiGreen#819B69
• terminal.ansiMagenta#B279A7
• terminal.ansiRed#DE6E7C
• terminal.ansiWhite#BBBBBB
• terminal.ansiYellow#B77E64
• terminalCursor.background#171213
• terminalCursor.foreground#C9C9C9
• textLink.activeForeground#B279A7d0
• textLink.foreground#B279A7
• widget.shadow#302829
• window.activeBorder#B279A7
• window.inactiveBorder#BBBBBB

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

Shiki preview

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

Loading...