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.background#423f45
  • activityBar.foreground#bcbabe
  • activityBarBadge.background#817f83
  • button.background#4a4543
  • button.foreground#bcbabe
  • dropdown.background#a5a2a2
  • dropdown.foreground#29252c
  • editor.background#2e2a31
  • editor.foreground#bcbabe
  • editor.lineHighlightBackground#83808555
  • editor.selectionBackground#666369
  • editorCursor.foreground#bcbabe
  • editorGroup.background#423f45
  • editorGroup.border#bcbabe
  • editorGroup.dropBackground#4a4543
  • editorGroupHeader.tabsBackground#423f45
  • editorWhitespace.foreground#838085
  • list.activeSelectionBackground#423f45
  • list.dropBackground#423f45
  • list.focusBackground#423f45
  • list.hoverBackground#423f45
  • list.inactiveSelectionBackground#423f45
  • notification.background#6b6766
  • sideBar.background#29252c
  • sideBarTitle.foreground#bcbabe
  • statusBar.background#423f45
  • statusBar.debuggingBackground#817f83
  • statusBar.foreground#bcbabe
  • statusBar.noFolderBackground#817f83
  • statusBarItem.prominentBackground#aba9ac
  • statusBarItem.prominentHoverBackground#aba9ac99
  • tab.activeBackground#2e2a31
  • tab.inactiveBackground#423f45

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#bcbabeff
variable.parameter.function#bcbabe
comment, punctuation.definition.comment#838085
punctuation.definition.string, punctuation.definition.variable, punctuation.definition.string, punctuation.definition.parameters, punctuation.definition.string, punctuation.definition.array#bcbabe
none#bcbabe
keyword.operator#bcbabe
keyword#bb60ea
variable#d8137f
entity.name.function, meta.require, support.function.any-method#796af5
support.class, entity.name.class, entity.name.type.class#dc8a0e
meta.class#f5f4f7
keyword.other.special-method#796af5
storage#bb60ea
support.function#149bda
string, constant.other.symbol, entity.other.inherited-class#17ad98
constant.numeric#d65407
none#d65407
none#d65407
constant#d65407
entity.name.tag#d8137f
entity.other.attribute-name#d65407
entity.other.attribute-name.id, punctuation.definition.entity#796af5
meta.selector#bb60ea
none#d65407
markup.heading punctuation.definition.heading, entity.name.section#796af5
keyword.other.unit#d65407
markup.bold, punctuation.definition.bold#dc8a0ebold
markup.italic, punctuation.definition.italic#bb60eaitalic
markup.raw.inline#17ad98
string.other.link, punctuation.definition.string.end.markdown#d8137f
meta.link#d65407
markup.list#d8137f
markup.quote#d65407
meta.separator#bcbabe
markup.inserted#17ad98
markup.deleted#d8137f
markup.changed#bb60ea
constant.other.color#149bda
string.regexp#149bda
constant.character.escape#149bda
punctuation.section.embedded, variable.interpolation#bb60ea
invalid.illegal#f5f4f7
invalid.broken#2e2a31
invalid.deprecated#f5f4f7
invalid.unimplemented#f5f4f7
token.info-token#316bcd
token.warn-token#cd9731
token.error-token#cd3131
token.debug-token#800080