Skip to main content
Coding Theme

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#060b0f
  • activityBar.foreground#d8f7ea
  • activityBar.inactiveForeground#8cb7a9
  • activityBarBadge.background#35d6a0
  • activityBarBadge.foreground#060b0f
  • badge.background#35d6a0
  • badge.foreground#060b0f
  • button.background#35d6a0
  • button.foreground#060b0f
  • button.hoverBackground#5cf0ad
  • dropdown.background#0b1319
  • dropdown.border#1d313d
  • dropdown.foreground#d8f7ea
  • editor.background#060b0f
  • editor.foreground#d8f7ea
  • editor.lineHighlightBackground#0b1319
  • editor.selectionBackground#1d313d
  • editor.selectionHighlightBackground#1d313d88
  • editor.wordHighlightBackground#35d6a022
  • editor.wordHighlightStrongBackground#35d6a033
  • editorBracketMatch.background#35d6a01a
  • editorBracketMatch.border#35d6a0
  • editorCursor.foreground#d8f7ea
  • editorHoverWidget.background#0b1319
  • editorHoverWidget.border#1d313d
  • editorIndentGuide.activeBackground1#376781
  • editorIndentGuide.background1#1d313d
  • editorInlayHint.background#0b1319
  • editorInlayHint.foreground#a7d3c2
  • editorLineNumber.activeForeground#d8f7ea
  • editorLineNumber.foreground#8cb7a9
  • editorSuggestWidget.background#0b1319
  • editorSuggestWidget.foreground#d8f7ea
  • editorSuggestWidget.selectedBackground#1d313d
  • editorWhitespace.foreground#1d313d
  • editorWidget.background#0b1319
  • editorWidget.border#1d313d
  • focusBorder#35d6a0
  • input.background#0b1319
  • input.border#1d313d
  • input.foreground#d8f7ea
  • inputOption.activeBorder#35d6a0
  • list.activeSelectionBackground#1d313d
  • list.activeSelectionForeground#d8f7ea
  • list.highlightForeground#35d6a0
  • list.hoverBackground#0b1319
  • panel.background#060b0f
  • panel.border#1d313d
  • scrollbarSlider.activeBackground#376781bb
  • scrollbarSlider.background#1d313d88
  • scrollbarSlider.hoverBackground#37678188
  • sideBar.background#0b1319
  • sideBar.border#1d313d
  • sideBar.foreground#d8f7ea
  • statusBar.background#0b1319
  • statusBar.debuggingBackground#376781
  • statusBar.foreground#d8f7ea
  • statusBar.noFolderBackground#0b1319
  • statusBarItem.remoteBackground#35d6a0
  • statusBarItem.remoteForeground#060b0f
  • tab.activeBackground#0b1319
  • tab.activeForeground#d8f7ea
  • tab.border#1d313d
  • tab.inactiveBackground#060b0f
  • tab.inactiveForeground#8cb7a9
  • terminal.ansiBlack#0b1319
  • terminal.ansiBlue#376781
  • terminal.ansiBrightBlack#1d313d
  • terminal.ansiBrightBlue#4a6d82
  • terminal.ansiBrightCyan#b7f7de
  • terminal.ansiBrightGreen#5cf0ad
  • terminal.ansiBrightMagenta#a7d3c2
  • terminal.ansiBrightRed#ff7a72
  • terminal.ansiBrightWhite#d8f7ea
  • terminal.ansiBrightYellow#ffe19a
  • terminal.ansiCyan#94f1cd
  • terminal.ansiGreen#35d6a0
  • terminal.ansiMagenta#8cb7a9
  • terminal.ansiRed#ff5f56
  • terminal.ansiWhite#d8f7ea
  • terminal.ansiYellow#ffd479
  • terminal.background#060b0f
  • terminal.foreground#d8f7ea
  • terminalCursor.foreground#d8f7ea
  • titleBar.activeBackground#060b0f
  • titleBar.activeForeground#d8f7ea
  • titleBar.inactiveBackground#0b1319
  • titleBar.inactiveForeground#8cb7a9

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#8cb7a9
keyword, storage.type, storage.modifier#35d6a0
string, string.quoted, string.template#94f1cd
constant.numeric, constant.language, support.constant#ffd479
entity.name.function, support.function, meta.function-call#d8f7ea
variable, meta.definition.variable, entity.name.type#a7d3c2
invalid, invalid.illegal#ff5f56
Leenium Theme by DrunkLeen - VS Code Theme