Skip to main content
Coding Theme

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#333
  • activityBar.foreground#EEE
  • activityBarBadge.background#d44a78
  • button.background#d44a78
  • button.foreground#CCC
  • editor.background#DEDEDE
  • editor.findMatchBackground#FFF
  • editor.findMatchHighlightBackground#fffec3
  • editor.foreground#333
  • editor.lineHighlightBackground#EEE
  • editor.rangeHighlightBackground#CCC
  • editor.selectionBackground#fffec3
  • editor.selectionHighlightBackground#fffec3
  • editor.wordHighlightBackground#fffec3
  • editorBracketMatch.background#fffec3
  • editorBracketMatch.border#fffec3
  • editorGutter.background#DEDEDE
  • editorLineNumber.activeForeground#333
  • editorLineNumber.foreground#AAA
  • editorWhitespace.foreground#CDCDCD
  • list.activeSelectionBackground#DEDEDE
  • list.activeSelectionForeground#111
  • list.focusBackground#DDD
  • list.highlightForeground#d44a78
  • list.inactiveSelectionBackground#DEDEDE
  • peekView.border#555
  • peekViewEditor.background#EEE
  • peekViewResult.background#DDD
  • peekViewResult.selectionBackground#666
  • peekViewResult.selectionForeground#CCC
  • peekViewTitle.background#CCC
  • sideBar.background#CCC
  • sideBar.foreground#111
  • statusBar.background#333
  • statusBar.foreground#CCCCCC
  • tab.activeBackground#DEDEDE
  • tab.activeBorderTop#d44a78
  • tab.activeForeground#333
  • tab.border#FFF
  • tab.inactiveBackground#FEFEFE
  • tab.inactiveForeground#999
  • terminal.ansiYellow#a56d2c
  • terminalCursor.foreground#333

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#AAA
string.quoted#01a252
string.regexp#37723fbold
entity.name.tag#777
entity.other.attribute-name, keyword.other#37723f
storage.type, storage.modifier, variable.function, keyword.other.var, keyword.type, keyword.control.at-rule.import#666
punctuation.definition.variable, variable.language, variable.other, variable.parameter, entity.name.variable.parameter, support.variable.property.dom, entity.name.variable.local, variable.other.object.property, entity.name.variable.field#478ed1
entity.name.function, support.function.dom#346592
entity.name.type.class#478ed1

Shiki preview

TypeScript sample highlighted with this variant's colors and tokenColors.

Loading...

Emotionally Mute VSCode Theme - Coding Theme