Zenbones Themes

Color themes

• 

  Zenbones Forestbones Dark Warm

• 

  Zenbones Forestbones Light

• 

  Zenbones Forestbones Light Bright

• 

  Zenbones Forestbones Light Dim

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#454F57
• activityBar.foreground#E7DCC4
• activityBarBadge.background#D69AB7
• activityBarBadge.foreground#3D464D
• badge.background#D69AB7
• badge.foreground#3D464D
• button.background#454F57
• button.foreground#E7DCC4
• button.secondaryBackground#3D464D
• button.secondaryForeground#EDE5D4
• checkbox.background#454F57
• checkbox.foreground#E7DCC4
• descriptionForeground#E7DCC4
• disabledForeground#E7DCC480
• editor.background#323A40
• editor.findMatchBackground#E3BCCE
• editor.findMatchHighlightBackground#A95782
• editor.foreground#E7DCC4
• editor.lineHighlightBackground#384148
• editor.selectionBackground#686357
• editorBracketHighlight.foreground1#7FBCB4
• editorBracketHighlight.foreground2#A9C181
• editorBracketHighlight.foreground3#D69AB7
• editorBracketHighlight.foreground4#7FBCB4
• editorBracketHighlight.foreground5#A9C181
• editorBracketHighlight.foreground6#D69AB7
• editorBracketHighlight.unexpectedBracket.foreground#E67C7F
• editorCursor.foreground#EBE2CF
• editorError.foreground#E67C7F
• editorGroupHeader.tabsBackground#3D464D
• editorGutter.addedBackground#444F32
• editorGutter.deletedBackground#6E3E3F
• editorGutter.modifiedBackground#35504D
• editorHint.foreground#D69AB7
• editorHoverWidget.background#434D54
• editorHoverWidget.border#56626C
• editorHoverWidget.foreground#E7DCC4
• editorIndentGuide.activeBackground#6D7B87a0
• editorIndentGuide.background#6D7B8750
• editorInfo.foreground#7FBCB4
• editorLineNumber.activeForeground#E7DCC4
• editorLineNumber.foreground#6D7B87
• editorOverviewRuler.addedForeground#444F32
• editorOverviewRuler.deletedForeground#6E3E3F
• editorOverviewRuler.errorForeground#E67C7F
• editorOverviewRuler.findMatchForeground#A95782
• editorOverviewRuler.infoForeground#7FBCB4
• editorOverviewRuler.modifiedForeground#35504D
• editorOverviewRuler.selectionHighlightForeground#686357
• editorOverviewRuler.warningForeground#DDBD7F
• editorRuler.foreground#6D7B87a0
• editorWarning.foreground#DDBD7F
• editorWidget.background#3D464D
• editorWidget.border#454F57
• editorWidget.foreground#EDE5D4
• errorForeground#E67C7F
• focusBorder#D69AB7
• foreground#E7DCC4
• icon.foreground#E7DCC4a0
• input.background#323A40
• input.foreground#E7DCC4
• input.placeholderForeground#758089
• inputOption.activeBorder#D69AB7
• inputValidation.errorBorder#E67C7F
• inputValidation.infoBorder#7FBCB4
• inputValidation.warningBorder#DDBD7F
• keybindingLabel.background#454F57
• keybindingLabel.border#434D54
• keybindingLabel.bottomBorder#56626C
• keybindingLabel.foreground#E7DCC4
• list.activeSelectionBackground#56626C
• list.activeSelectionForeground#E7DCC4
• list.highlightForeground#D69AB7
• list.hoverBackground#56626C50
• list.inactiveSelectionBackground#56626Ca0
• minimap.errorHighlight#E67C7F
• minimap.findMatchHighlight#A95782
• minimap.selectionHighlight#686357
• minimap.warningHighlight#DDBD7F
• minimapGutter.addedBackground#444F32
• minimapGutter.deletedBackground#6E3E3F
• minimapGutter.modifiedBackground#35504D
• notificationCenterHeader.background#3D464D
• notificationCenterHeader.foreground#EDE5D4
• notificationLink.foreground#D69AB7
• notifications.background#323A40
• notifications.foreground#E7DCC4
• notificationsErrorIcon.foreground#E67C7F
• notificationsInfoIcon.foreground#7FBCB4
• notificationsWarningIcon.foreground#DDBD7F
• panel.background#323A40
• panel.border#6D7B87a0
• panelTitle.activeBorder#6D7B87a0
• panelTitle.activeForeground#E7DCC4
• panelTitle.inactiveForeground#E7DCC4a0
• pickerGroup.border#6D7B87a0
• pickerGroup.foreground#EDE5D4
• problemsErrorIcon.foreground#E67C7F
• problemsInfoIcon.foreground#7FBCB4
• problemsWarningIcon.foreground#DDBD7F
• quickInput.background#3D464D
• quickInput.foreground#EDE5D4
• quickInputList.focusBackground#454F57
• quickInputList.focusForeground#E7DCC4
• scrollbar.shadow#454F57
• scrollbarSlider.activeBackground#66747F
• scrollbarSlider.background#434D54
• scrollbarSlider.hoverBackground#56626C
• selection.background#686357
• sideBar.background#3D464D
• sideBar.foreground#EDE5D4
• sideBarSectionHeader.background#454F57
• sideBarSectionHeader.foreground#E7DCC4
• statusBar.background#3D464D
• statusBar.debuggingBackground#3D464D
• statusBar.foreground#EDE5D4
• statusBar.noFolderBackground#3D464D
• statusBarItem.remoteBackground#454F57
• statusBarItem.remoteForeground#E7DCC4
• tab.activeBackground#323A40
• tab.activeForeground#E7DCC4
• tab.border#3D464D
• tab.inactiveBackground#454F57
• tab.inactiveForeground#E7DCC4a0
• terminal.ansiBlack#2C343A
• terminal.ansiBlue#7FBCB4
• terminal.ansiBrightBlack#45525C
• terminal.ansiBrightBlue#7AC9C0
• terminal.ansiBrightCyan#7DD093
• terminal.ansiBrightGreen#B0CE7B
• terminal.ansiBrightMagenta#E5A7C4
• terminal.ansiBrightRed#ED9294
• terminal.ansiBrightWhite#B2A790
• terminal.ansiBrightYellow#EDC77A
• terminal.ansiCyan#83C193
• terminal.ansiGreen#A9C181
• terminal.ansiMagenta#D69AB7
• terminal.ansiRed#E67C7F
• terminal.ansiWhite#E7DCC4
• terminal.ansiYellow#DDBD7F
• terminalCursor.background#323A40
• terminalCursor.foreground#EBE2CF
• textLink.activeForeground#D69AB7d0
• textLink.foreground#D69AB7
• widget.shadow#454F57
• window.activeBorder#D69AB7
• window.inactiveBorder#E7DCC4

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

Shiki preview

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

Loading...