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.activeBackground#170A2F
  • activityBar.activeBorder#A77BE8
  • activityBar.background#070212
  • activityBar.foreground#B99AEF
  • activityBar.inactiveForeground#6642bb
  • activityBarBadge.background#7A5AA6
  • activityBarBadge.foreground#E6DDF5
  • editor.background#0C051C
  • editor.foreground#D1C9E8
  • editor.lineHighlightBackground#170A3350
  • editor.selectionBackground#4a229a80
  • editorBracketMatch.background#25124A80
  • editorBracketMatch.border#C099FF
  • editorCursor.foreground#C099FF
  • editorIndentGuide.activeBackground1#C099FF
  • editorIndentGuide.background1#1C1136
  • list.activeSelectionBackground#170A33
  • list.activeSelectionForeground#EBE5F7
  • list.hoverBackground#170A3380
  • list.hoverForeground#c1b3eb
  • menu.background#080314
  • menu.foreground#8F85A8
  • menu.selectionBackground#25124A
  • menu.selectionForeground#6642bb
  • menubar.selectionBackground#0C051C
  • menubar.selectionForeground#EBE5F7
  • quickInput.background#0C051C
  • quickInput.foreground#6642bb
  • sideBar.background#080314
  • sideBar.foreground#8F85A8
  • statusBar.background#0C051C
  • statusBar.debuggingBackground#120820
  • statusBar.debuggingBorder#25143D
  • statusBar.debuggingForeground#AFA2C8
  • statusBar.foreground#a6ceff
  • statusBarItem.hoverBackground#1B0C36
  • statusBarItem.hoverForeground#C8BCE0
  • statusBarItem.prominentBackground#1B0C36
  • statusBarItem.prominentForeground#B9A8D4
  • statusBarItem.prominentHoverBackground#28144A
  • statusBarItem.prominentHoverForeground#D4C8E5
  • tab.activeBackground#0C051C
  • tab.activeBorderTop#C099FF
  • tab.activeForeground#7438eb
  • tab.hoverBackground#170A3360
  • tab.inactiveBackground#080314
  • tab.inactiveForeground#675D82
  • terminalCursor.foreground#764db7

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#5C5278italic
variable, variable.other.readwrite, meta.definition.variable#7B99FC
variable.parameter#7B99FCitalic
keyword, storage.type, storage.modifier#BB94FAbold italic
variable.other.property, meta.object-literal.key, meta.property-name, support.type.property-name#fb9d6e
string, string.quoted#f16c6citalic
entity.name.function, support.function, meta.function-call#82AAFF
constant.numeric#ff6868
constant.language, support.constant, variable.language.this#f76d94bold italic
entity.name.type, entity.name.class, support.type, support.class#69abf8
keyword.operator#45ebeb
punctuation, meta.brace, punctuation.separator.key-value, punctuation.separator.dictionary.key-value#AC8DCF
DarkNightCode by Bro_Code - VS Code Theme