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#080808
  • activityBar.foreground#00ff41
  • activityBarBadge.background#00ff41
  • activityBarBadge.foreground#0d0d0d
  • button.background#00ff41
  • button.foreground#0d0d0d
  • editor.background#0d0d0d
  • editor.foreground#00ff41
  • editor.lineHighlightBackground#111111
  • editor.selectionBackground#003b00
  • editor.selectionHighlightBackground#003b0088
  • editor.wordHighlightBackground#003b0066
  • editorCursor.foreground#00ff41
  • editorGroupHeader.tabsBackground#080808
  • editorIndentGuide.background1#003b00
  • editorLineNumber.activeForeground#00ff41
  • editorLineNumber.foreground#003b00
  • editorLink.activeForeground#00ff41
  • editorRuler.foreground#003b00
  • editorWhitespace.foreground#1a3300
  • list.activeSelectionBackground#00ff41
  • list.activeSelectionForeground#000
  • list.focusHighlightForeground#003b00
  • list.highlightForeground#66ff99
  • list.hoverBackground#00ff41
  • list.inactiveSelectionBackground#00ff41
  • list.inactiveSelectionForeground#000
  • panel.background#080808
  • pickerGroup.border#003b00
  • pickerGroup.foreground#00ff41
  • quickInput.background#080808
  • quickInput.foreground#00ff41
  • quickInputList.focusBackground#00ff41
  • quickInputList.focusForeground#0d0d0d
  • sideBar.background#080808
  • sideBar.foreground#00cc33
  • sideBarSectionHeader.background#111111
  • sideBarSectionHeader.foreground#00ff41
  • sideBarTitle.foreground#00ff41
  • statusBar.background#003b00
  • statusBar.foreground#00ff41
  • tab.activeBackground#0d0d0d
  • tab.activeForeground#00ff41
  • tab.inactiveBackground#080808
  • tab.inactiveForeground#00cc33
  • terminal.background#0d0d0d
  • terminal.foreground#00ff41
  • terminalCursor.foreground#00ff41
  • titleBar.activeBackground#080808

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#005500italic
keyword, keyword.control, keyword.operator.expression#00ff41
storage, storage.type, storage.modifier#00cc33
variable#00ff41
variable.language#00ffccitalic
string, string.quoted, punctuation.definition.string#33ff66
constant, constant.numeric, constant.language#aaff00
entity.name.function, support.function#00ffcc
entity.name.type.class, entity.name.class, support.class#00ffcc
entity.other.inherited-class#00ffccitalic
entity.name.tag#00ff41
entity.other.attribute-name#66ff99italic
support.type, support.class#00ffcc
variable.parameter, entity.name.variable.parameteritalic
keyword.control.new, keyword.operator.newbold italic
markup.italicitalic
markup.boldbold
markup.heading#00ffccbold