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#161818
  • activityBar.foreground#c2c2b0
  • activityBarBadge.background#5cad4a
  • activityBarBadge.foreground#1c1e1f
  • button.background#5cad4a
  • button.foreground#1c1e1f
  • editor.background#1c1e1f
  • editor.foreground#c2c2b0
  • editor.lineHighlightBackground#272929
  • editor.selectionBackground#363a3b
  • editor.selectionHighlightBackground#363a3b88
  • editor.wordHighlightBackground#363a3b66
  • editorCursor.foreground#c2c2b0
  • editorGroupHeader.tabsBackground#161818
  • editorIndentGuide.background1#363a3b
  • editorLineNumber.activeForeground#c2c2b0
  • editorLineNumber.foreground#363a3b
  • editorLink.activeForeground#5cad4a
  • editorRuler.foreground#363a3b
  • editorWhitespace.foreground#363a3b
  • editorWidget.background#1c1e1f
  • input.background#1c1e1f
  • list.activeSelectionBackground#5cad4a
  • list.activeSelectionForeground#fff
  • list.focusHighlightForeground#1c1e1f
  • list.highlightForeground#fff
  • list.hoverBackground#363a3b
  • list.inactiveSelectionBackground#5cad4a
  • list.inactiveSelectionForeground#000
  • panel.background#161818
  • quickInput.background#161818
  • sideBar.background#161818
  • sideBar.foreground#c2c2b0
  • sideBarSectionHeader.background#272929
  • sideBarSectionHeader.foreground#5cad4a
  • sideBarTitle.foreground#5cad4a
  • statusBar.background#272929
  • statusBar.foreground#c2c2b0
  • tab.activeBackground#1c1e1f
  • tab.activeForeground#c2c2b0
  • tab.inactiveBackground#161818
  • tab.inactiveForeground#c2c2b0
  • terminal.background#1c1e1f
  • terminal.foreground#c2c2b0
  • terminalCursor.foreground#c2c2b0
  • titleBar.activeBackground#161818

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
keyword.control, keyword.operator.expression, keyword.operator.new, keyword.control.new, storage.type, storage.modifier, keyword.other.use, keyword.other.namespace, storage.modifier.extends, entity.other.inherited-class, variable.language, variable.language.this, variable.language.self, variable.language.super, variable.language.parent, variable.language punctuation.definition.variable.php, punctuation.definition.variable.php, keyword.control.php, keyword.control.flow, keyword.control.async-modifier, keyword.control.import, keyword.control.export, keyword.control.from, keyword.control.returnitalic
comment, punctuation.definition.comment#5c6162italic
keyword, keyword.control, keyword.operator.expression#cf8164
storage, storage.type, storage.modifier#a9a9a9
variable#c2c2b0
variable.language#cf8164italic
string, string.quoted, punctuation.definition.string#5cad4a
constant, constant.numeric, constant.language#d7af00
entity.name.function, support.function#85d3f2
entity.name.type.class, entity.name.class, support.class#d7af00
entity.other.inherited-class#d7af00italic
entity.name.tag#cf8164
entity.other.attribute-name#5cad4aitalic
support.type, support.class#85d3f2
variable.parameter, entity.name.variable.parameteritalic
keyword.control.new, keyword.operator.newbold italic
markup.italicitalic
markup.boldbold
markup.heading#85d3f2bold