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#d9d8d4
  • activityBar.foreground#515151
  • activityBarBadge.background#91908d
  • button.background#91908d
  • button.foreground#515151
  • dropdown.background#d9d8d4
  • dropdown.foreground#515151
  • editor.background#f2f0ec
  • editor.foreground#515151
  • editor.lineHighlightBackground#a09f9355
  • editor.selectionBackground#e8e6df
  • editorCursor.foreground#515151
  • editorGroup.background#d9d8d4
  • editorGroup.border#515151
  • editorGroup.dropBackground#e8e6df
  • editorGroupHeader.tabsBackground#d9d8d4
  • editorWhitespace.foreground#e8e6df
  • list.activeSelectionBackground#d9d8d4
  • list.dropBackground#d9d8d4
  • list.focusBackground#d9d8d4
  • list.hoverBackground#d9d8d4
  • list.inactiveSelectionBackground#d9d8d4
  • notification.background#515151
  • sideBar.background#f4f3ef
  • sideBarTitle.foreground#515151
  • statusBar.background#d9d8d4
  • statusBar.debuggingBackground#91908d
  • statusBar.foreground#515151
  • statusBar.noFolderBackground#91908d
  • statusBarItem.prominentBackground#a9a8a5
  • statusBarItem.prominentHoverBackground#a9a8a599
  • tab.activeBackground#f2f0ec
  • tab.inactiveBackground#d9d8d4

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#515151
variable.parameter.function#515151
comment, punctuation.definition.comment#a09f93
punctuation.definition.string, punctuation.definition.variable, punctuation.definition.string, punctuation.definition.parameters, punctuation.definition.string, punctuation.definition.array#515151
none#515151
keyword.operator#515151
keyword#cc99cc
variable#f2777a
entity.name.function, meta.require, support.function.any-method#6699cc
support.class, entity.name.class, entity.name.type.class#f99157
meta.class#393939
keyword.other.special-method#6699cc
storage#cc99cc
support.function#66cccc
string, constant.other.symbol, entity.other.inherited-class#99cc99
constant.numeric#f99157
none#f99157
none#f99157
constant#f99157
entity.name.tag#f2777a
entity.other.attribute-name#f99157
entity.other.attribute-name.id, punctuation.definition.entity#6699cc
meta.selector#cc99cc
none#f99157
markup.heading punctuation.definition.heading, entity.name.section#6699cc
keyword.other.unit#f99157
markup.bold, punctuation.definition.bold#f99157bold
markup.italic, punctuation.definition.italic#cc99ccitalic
markup.raw.inline#99cc99
string.other.link#f2777a
meta.link#f99157
markup.list#f2777a
markup.quote#f99157
meta.separator#515151
markup.inserted#99cc99
markup.deleted#f2777a
markup.changed#cc99cc
constant.other.color#66cccc
string.regexp#66cccc
constant.character.escape#66cccc
punctuation.section.embedded, variable.interpolation#d27b53
invalid.illegal#f2f0ec
invalid.broken#2d2d2d
invalid.deprecated#f2f0ec
invalid.unimplemented#2d2d2d