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#F0E6F0
  • activityBar.foreground#170E2B
  • activityBar.inactiveForeground#170E2B60
  • activityBarBadge.background#7547D6
  • activityBarBadge.foreground#F0E6F0
  • editor.background#F0E6F0
  • editor.foreground#170E2B
  • editor.lineHighlightBackground#F2E9F2
  • editor.selectionBackground#7547D680
  • editorCursor.foreground#7547D6
  • editorIndentGuide.activeBackground#7547D660
  • editorIndentGuide.background#462B8020
  • editorWhitespace.foreground#462B8040
  • sideBar.background#F2E9F2
  • sideBar.foreground#170E2B
  • sideBarSectionHeader.background#F0E6F0
  • statusBar.background#7547D6
  • statusBar.foreground#F0E6F0
  • statusBar.noFolderBackground#7547D6
  • tab.activeBackground#F0E6F0
  • tab.activeForeground#170E2B
  • tab.inactiveBackground#D8CFD8
  • tab.inactiveForeground#170E2B80
  • terminal.background#F0E6F0
  • terminal.foreground#170E2B
  • titleBar.activeBackground#F0E6F0
  • titleBar.activeForeground#170E2B

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#462B80
string#BD47D6
string.regexp#47D675
constant.numeric#A8D647
constant.language#A8D647italic
keyword#7547D6bold
storage#7547D6
storage.type#A8D647italic
entity.name.function#D67547
entity.name.class#D64761bold
entity.name.type#A8D647
variable#170E2B
variable.parameter#4761D6italic
variable.other.property#D6BD47
punctuation#170E2BB0