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.activeBackground#eeeeee
  • activityBar.activeBorder#444444
  • activityBar.background#eeeeee
  • activityBar.foreground#444444
  • activityBar.inactiveForeground#b2b2b2
  • editor.background#eeeeee
  • editor.foreground#444444
  • editor.inactiveSelectionBackground#dddddd
  • editor.selectionBackground#dddddd
  • editorCursor.foreground#444444
  • editorIndentGuide.activeBackground1#b2b2b2
  • editorIndentGuide.background1#dddddd
  • editorLineNumber.activeForeground#444444
  • editorLineNumber.foreground#b2b2b2
  • editorWhitespace.foreground#dddddd
  • list.activeSelectionBackground#dddddd
  • list.activeSelectionForeground#444444
  • sideBar.background#eeeeee
  • statusBar.background#eeeeee
  • tab.activeBackground#eeeeee
  • tab.inactiveBackground#dddddd
  • titleBar.activeBackground#eeeeee

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#b2b2b2
keyword, keyword.control, keyword.other#8b6a9a
storage.type, storage.modifier#8b6a9a
string, string.quoted#a0723a
constant.numeric, constant.language#a0723a
entity.name.function, support.function#5a7fa8
entity.name.type, entity.name.class, support.type, support.class#a07840
entity.name.tag#5a7fa8
support.class.component#4a9a8a
entity.other.attribute-name#7a8a3a
variable, variable.other#444444
keyword.operator, punctuation#888888
invalid, invalid.illegal#d70000
paper Monkeytype by 404abe - VS Code Theme