Zenbones Themes

Color themes

• 

  Zenbones Tokyobones Light Dim

• 

  Zenbones Vimbones Light

• 

  Zenbones Vimbones Light Bright

• 

  Zenbones Vimbones 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#B1B3BB
• activityBar.foreground#333A57
• activityBarBadge.background#5A4A79
• activityBarBadge.foreground#BFC1C7
• badge.background#5A4A79
• badge.foreground#BFC1C7
• button.background#B1B3BB
• button.foreground#333A57
• button.secondaryBackground#BFC1C7
• button.secondaryForeground#5F6B9B
• checkbox.background#B1B3BB
• checkbox.foreground#333A57
• descriptionForeground#333A57
• disabledForeground#333A5780
• editor.background#CDCFD4
• editor.findMatchBackground#7B699E
• editor.findMatchHighlightBackground#ABA0C3
• editor.foreground#333A57
• editor.lineHighlightBackground#C8C9CF
• editor.selectionBackground#B2B8D3
• editorBracketHighlight.foreground1#34548C
• editorBracketHighlight.foreground2#34645D
• editorBracketHighlight.foreground3#5A4A79
• editorBracketHighlight.foreground4#34548C
• editorBracketHighlight.foreground5#34645D
• editorBracketHighlight.foreground6#5A4A79
• editorBracketHighlight.unexpectedBracket.foreground#8B4351
• editorCursor.foreground#333A57
• editorError.foreground#8B4351
• editorGroupHeader.tabsBackground#BFC1C7
• editorGutter.addedBackground#A2C5BF
• editorGutter.deletedBackground#DBB5BA
• editorGutter.modifiedBackground#B7BED2
• editorHint.foreground#5A4A79
• editorHoverWidget.background#B7B8C0
• editorHoverWidget.border#9EA0AB
• editorHoverWidget.foreground#333A57
• editorIndentGuide.activeBackground#838693a0
• editorIndentGuide.background#83869350
• editorInfo.foreground#34548C
• editorLineNumber.activeForeground#333A57
• editorLineNumber.foreground#838693
• editorOverviewRuler.addedForeground#A2C5BF
• editorOverviewRuler.deletedForeground#DBB5BA
• editorOverviewRuler.errorForeground#8B4351
• editorOverviewRuler.findMatchForeground#ABA0C3
• editorOverviewRuler.infoForeground#34548C
• editorOverviewRuler.modifiedForeground#B7BED2
• editorOverviewRuler.selectionHighlightForeground#B2B8D3
• editorOverviewRuler.warningForeground#8F5E14
• editorRuler.foreground#838693a0
• editorWarning.foreground#8F5E14
• editorWidget.background#BFC1C7
• editorWidget.border#B1B3BB
• editorWidget.foreground#5F6B9B
• errorForeground#8B4351
• focusBorder#5A4A79
• foreground#333A57
• icon.foreground#333A57a0
• input.background#CDCFD4
• input.foreground#333A57
• input.placeholderForeground#777983
• inputOption.activeBorder#5A4A79
• inputValidation.errorBorder#8B4351
• inputValidation.infoBorder#34548C
• inputValidation.warningBorder#8F5E14
• keybindingLabel.background#B1B3BB
• keybindingLabel.border#B7B8C0
• keybindingLabel.bottomBorder#9EA0AB
• keybindingLabel.foreground#333A57
• list.activeSelectionBackground#9EA0AB
• list.activeSelectionForeground#333A57
• list.highlightForeground#5A4A79
• list.hoverBackground#9EA0AB50
• list.inactiveSelectionBackground#9EA0ABa0
• minimap.errorHighlight#8B4351
• minimap.findMatchHighlight#ABA0C3
• minimap.selectionHighlight#B2B8D3
• minimap.warningHighlight#8F5E14
• minimapGutter.addedBackground#A2C5BF
• minimapGutter.deletedBackground#DBB5BA
• minimapGutter.modifiedBackground#B7BED2
• notificationCenterHeader.background#BFC1C7
• notificationCenterHeader.foreground#5F6B9B
• notificationLink.foreground#5A4A79
• notifications.background#CDCFD4
• notifications.foreground#333A57
• notificationsErrorIcon.foreground#8B4351
• notificationsInfoIcon.foreground#34548C
• notificationsWarningIcon.foreground#8F5E14
• panel.background#CDCFD4
• panel.border#838693a0
• panelTitle.activeBorder#838693a0
• panelTitle.activeForeground#333A57
• panelTitle.inactiveForeground#333A57a0
• pickerGroup.border#838693a0
• pickerGroup.foreground#5F6B9B
• problemsErrorIcon.foreground#8B4351
• problemsInfoIcon.foreground#34548C
• problemsWarningIcon.foreground#8F5E14
• quickInput.background#BFC1C7
• quickInput.foreground#5F6B9B
• quickInputList.focusBackground#B1B3BB
• quickInputList.focusForeground#333A57
• scrollbar.shadow#B1B3BB
• scrollbarSlider.activeBackground#8E909C
• scrollbarSlider.background#B7B8C0
• scrollbarSlider.hoverBackground#9EA0AB
• selection.background#B2B8D3
• sideBar.background#BFC1C7
• sideBar.foreground#5F6B9B
• sideBarSectionHeader.background#B1B3BB
• sideBarSectionHeader.foreground#333A57
• statusBar.background#BFC1C7
• statusBar.debuggingBackground#BFC1C7
• statusBar.foreground#5F6B9B
• statusBar.noFolderBackground#BFC1C7
• statusBarItem.remoteBackground#B1B3BB
• statusBarItem.remoteForeground#333A57
• tab.activeBackground#CDCFD4
• tab.activeForeground#333A57
• tab.border#BFC1C7
• tab.inactiveBackground#B1B3BB
• tab.inactiveForeground#333A57a0
• terminal.ansiBlack#D6D7DC
• terminal.ansiBlue#34548C
• terminal.ansiBrightBlack#ADB0BD
• terminal.ansiBrightBlue#26467A
• terminal.ansiBrightCyan#34645D
• terminal.ansiBrightGreen#26554F
• terminal.ansiBrightMagenta#503875
• terminal.ansiBrightRed#7E3242
• terminal.ansiBrightWhite#56618D
• terminal.ansiBrightYellow#794E0D
• terminal.ansiCyan#176775
• terminal.ansiGreen#34645D
• terminal.ansiMagenta#5A4A79
• terminal.ansiRed#8B4351
• terminal.ansiWhite#333A57
• terminal.ansiYellow#8F5E14
• terminalCursor.background#CDCFD4
• terminalCursor.foreground#333A57
• textLink.activeForeground#5A4A79d0
• textLink.foreground#5A4A79
• widget.shadow#B1B3BB
• window.activeBorder#5A4A79
• window.inactiveBorder#333A57

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

Shiki preview

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

Loading...