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#bdcfcd
  • activityBar.foreground#184e45
  • activityBarBadge.background#7e8a88
  • button.background#7e8a88
  • button.foreground#184e45
  • dropdown.background#bdcfcd
  • dropdown.foreground#184e45
  • editor.background#d2e7e4
  • editor.foreground#184e45
  • editor.lineHighlightBackground#5F9C9255
  • editor.selectionBackground#a7cec8
  • editorCursor.foreground#184e45
  • editorGroup.background#bdcfcd
  • editorGroup.border#184e45
  • editorGroup.dropBackground#a7cec8
  • editorGroupHeader.tabsBackground#bdcfcd
  • editorWhitespace.foreground#a7cec8
  • list.activeSelectionBackground#bdcfcd
  • list.dropBackground#bdcfcd
  • list.focusBackground#bdcfcd
  • list.hoverBackground#bdcfcd
  • list.inactiveSelectionBackground#bdcfcd
  • notification.background#184e45
  • sideBar.background#dbebe9
  • sideBarTitle.foreground#184e45
  • statusBar.background#bdcfcd
  • statusBar.debuggingBackground#7e8a88
  • statusBar.foreground#184e45
  • statusBar.noFolderBackground#7e8a88
  • statusBarItem.prominentBackground#93a19f
  • statusBarItem.prominentHoverBackground#93a19f99
  • tab.activeBackground#d2e7e4
  • tab.inactiveBackground#bdcfcd

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#184e45
variable.parameter.function#184e45
comment, punctuation.definition.comment#5F9C92
punctuation.definition.string, punctuation.definition.variable, punctuation.definition.string, punctuation.definition.parameters, punctuation.definition.string, punctuation.definition.array#184e45
none#184e45
keyword.operator#184e45
keyword#4C963E
variable#3E9688
entity.name.function, meta.require, support.function.any-method#96883E
support.class, entity.name.class, entity.name.type.class#3E7996
meta.class#0B342D
keyword.other.special-method#96883E
storage#4C963E
support.function#963E4C
string, constant.other.symbol, entity.other.inherited-class#883E96
constant.numeric#3E7996
none#3E7996
none#3E7996
constant#3E7996
entity.name.tag#3E9688
entity.other.attribute-name#3E7996
entity.other.attribute-name.id, punctuation.definition.entity#96883E
meta.selector#4C963E
none#3E7996
markup.heading punctuation.definition.heading, entity.name.section#96883E
keyword.other.unit#3E7996
markup.bold, punctuation.definition.bold#3E7996bold
markup.italic, punctuation.definition.italic#4C963Eitalic
markup.raw.inline#883E96
string.other.link#3E9688
meta.link#3E7996
markup.list#3E9688
markup.quote#3E7996
meta.separator#184e45
markup.inserted#883E96
markup.deleted#3E9688
markup.changed#4C963E
constant.other.color#963E4C
string.regexp#963E4C
constant.character.escape#963E4C
punctuation.section.embedded, variable.interpolation#3E965B
invalid.illegal#d2e7e4
invalid.broken#031A16
invalid.deprecated#d2e7e4
invalid.unimplemented#031A16