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#252525
  • debugIcon.breakpointCurrentStackframeForeground#887109
  • debugIcon.breakpointForeground#b15959
  • editor.background#171717
  • editor.findMatchBackground#242020
  • editor.findMatchBorder#79522d
  • editor.findMatchHighlightBackground#313131
  • editor.foreground#ffffff
  • editor.selectionBackground#252525
  • editor.selectionForeground#bfbfbf
  • editor.selectionHighlightBackground#313131
  • editor.stackFrameHighlightBackground#332b03
  • list.filterMatchBackground#1100ff
  • minimap.findMatchHighlight#a8601c
  • minimap.selectionHighlight#555970
  • searchEditor.findMatchBackground#33ff00
  • sideBar.background#1b1b1b
  • sideBar.foreground#a0a0a0
  • sideBarSectionHeader.background#252525
  • statusBar.background#31323a
  • statusBar.foreground#a5a5a5
  • tab.inactiveBackground#252525
  • terminal.foreground#a0a0a0
  • titleBar.activeBackground#1b1b1b

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
source#a0a0a0
meta.export.default#a0988a
storage.type#464b58
variable.other.constant entity.name.function, meta.definition.function entity.name.function#c19267
keyword.control#725f8c
string.regexp#724772
variable.parameter#c1b4a4
meta.parameters#4f4f4f
meta.function-call entity.name.function#a17768
comment#474747
constant, string#6d7e6d
meta.definition.variable, meta.object-literal.key#7b8b9d
punctuation, meta.brace.round#545454
storage.type.function, meta.brace.curly, meta.brace.square, keyword.operator, meta.objectliteral punctuation.definition.block#777777
punctuation.definition.string#4c524c
constant.language#6d7e6ditalic bold
storage.modifier.async#725f8c
string variable.other.readwrite#A0A0A0
Beans dim by danielcjacks - VS Code Theme