Skip to main content
Coding Theme

Color themes

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.activeBorder#70f1ff
  • activityBar.background#10142a
  • activityBar.foreground#70f1ff
  • activityBarBadge.background#7c83ff
  • button.background#70f1ff
  • button.foreground#0f1323
  • editor.background#0f1323
  • editor.foreground#e3e6ef
  • editor.lineHighlightBackground#161a2d
  • editor.selectionBackground#3d4a75
  • editor.selectionHighlightBackground#20305080
  • editorBracketMatch.background#1b8ecc33
  • editorBracketMatch.border#70f1ff
  • editorCursor.foreground#70f1ff
  • editorIndentGuide.activeBackground#5665a8
  • editorIndentGuide.background#2c3050
  • editorWhitespace.foreground#2c3050
  • focusBorder#70f1ff
  • input.background#151a31
  • input.border#4252a8
  • input.foreground#e3e6ef
  • menu.background#10142a
  • menu.foreground#d8e1ff
  • menu.selectionBackground#70f1ff20
  • menu.selectionForeground#ffffff
  • notifications.background#141b34
  • notifications.foreground#d3daf0
  • sideBar.background#13172e
  • sideBar.foreground#cad2f4
  • sideBarTitle.foreground#d7e0ff
  • statusBar.background#10142a
  • statusBar.foreground#c7d0f9
  • tab.activeBackground#131a34
  • tab.activeForeground#e3e6ef
  • tab.inactiveBackground#10142a
  • tab.inactiveForeground#8fa0c2
  • terminal.background#0f1323
  • terminal.foreground#e3e6ef
  • terminalCursor.foreground#70f1ff
  • titleBar.activeBackground#10142a
  • titleBar.activeForeground#70f1ff

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#8a9bffitalic
keyword, storage.type, storage.modifier#70f1ffbold
entity.name.function, meta.function-call, support.function#ffd070bold
string, constant.other.symbol, constant.character.escape#7cffb1
variable, identifier, support.variable#d4dbff
constant.numeric, constant.language, support.constant#ffb270
storage.modifier.import, storage.type.class#c688ffbold
entity.name.type, support.type#82c7ff
invalid, invalid.illegal#ff5370underline
markup.heading, markup.bold#ffd070bold
markup.italic#b7c0ffitalic
punctuation, operator#d3daf0