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#1a1a1f
  • editor.background#1a1a1f
  • editor.foreground#e6e6e6
  • editor.selectionBackground#7a5fa833
  • editorCursor.foreground#9e81c3
  • editorIndentGuide.activeBackground1#7a5fa8
  • editorIndentGuide.background1#3c3c4c
  • editorLineNumber.activeForeground#9e81c3
  • editorLineNumber.foreground#7b7b8c
  • list.activeSelectionBackground#2a2435
  • list.hoverBackground#251f33
  • list.inactiveSelectionBackground#2a2435
  • sideBar.background#14141a
  • sideBar.foreground#e6e6e6
  • sideBarSectionHeader.background#1a1a1f
  • sideBarSectionHeader.foreground#9e81c3
  • sideBarTitle.foreground#9e81c3
  • statusBar.background#1a1a1f
  • tab.activeBackground#7a5fa8
  • tab.activeForeground#ffffff
  • tab.inactiveBackground#1a1a1f
  • tab.inactiveForeground#9e81c3

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#6c6c7aitalic
string, constant.other.symbol#cba6f7
keyword, storage.type, storage.modifier#a277ff
entity.name.function, support.function#f38ba8
variable, identifier#89b4fa
constant.numeric, constant.language#f9ae58
entity.name.type, support.class, support.type#94e2d5
invalid, invalid.illegal#ff6b6b