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.activeBorder#005FB8
  • activityBar.background#F3F2EF
  • activityBar.border#E5E5E5
  • activityBar.foreground#1F1F1F
  • activityBar.inactiveForeground#616161
  • activityBarBadge.background#91a51f
  • activityBarBadge.foreground#FFFFFF
  • button.background#91a51f
  • button.border#0000001a
  • button.foreground#FFFFFF
  • button.hoverBackground#1e7f28
  • button.secondaryBackground#E5E5E5
  • button.secondaryForeground#3B3B3B
  • button.secondaryHoverBackground#CCCCCC
  • dropdown.background#FFFFFF
  • dropdown.border#CECECE
  • dropdown.foreground#3B3B3B
  • dropdown.listBackground#FFFFFF
  • editor.background#F3F2EF
  • editor.foreground#5f5f5e
  • editor.lineHighlightBackground#e9e9e6
  • editor.selectionBackground#d9dad2
  • editorCursor.foreground#0f0f0e
  • editorWhitespace.foreground#e5e4e1
  • list.activeSelectionBackground#91a51f
  • list.activeSelectionForeground#000000
  • list.activeSelectionIconForeground#000000
  • list.focusAndSelectionOutline#91a51f
  • list.hoverBackground#F2F2F2
  • menu.border#CECECE
  • menu.selectionBackground#91a51f
  • menu.selectionForeground#ffffff
  • sideBar.background#F3F2EF
  • sideBar.border#E5E5E5
  • sideBar.foreground#3B3B3B
  • sideBarSectionHeader.background#F8F8F8
  • sideBarSectionHeader.border#E5E5E5
  • sideBarSectionHeader.foreground#3B3B3B
  • sideBarTitle.foreground#3B3B3B
  • statusBar.background#ebdaa7
  • statusBar.border#E5E5E5
  • statusBar.debuggingBackground#FD716C
  • statusBar.debuggingForeground#000000
  • statusBar.focusBorder#005FB8
  • statusBar.foreground#3B3B3B
  • statusBar.noFolderBackground#F8F8F8
  • statusBarItem.errorBackground#C72E0F
  • statusBarItem.focusBorder#005FB8
  • statusBarItem.prominentBackground#6E768166
  • statusBarItem.remoteBackground#91a51f
  • statusBarItem.remoteForeground#FFFFFF
  • terminal.foreground#3B3B3B
  • terminal.inactiveSelectionBackground#E5EBF1
  • terminal.tab.activeBorder#005FB8
  • terminalCursor.foreground#91a51f
  • titleBar.activeBackground#91a51f
  • titleBar.activeForeground#000000
  • titleBar.border#E5E5E5
  • titleBar.inactiveBackground#91a51f
  • titleBar.inactiveForeground#000000

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#91a51f
string#1a1a19
constant.numeric#1a1a19
constant.language#1a1a19
constant.character, constant.other#1a1a19
variable
keyworditalic
keyword.operator
storage
storage.type, support.typeitalic
storage.type
entity.name.class
entity.other.inherited-class
entity.name.function
variable.parameter
entity.name.tag, punctuation.definition.tag, entity.other.attribute-name, string.quoted.single.html, string.quoted.double.html, string.quoted.single.xml, string.quoted.double.xml, meta.tag#a4a3a1
string.quoted.double.json, string.quoted.single.json#5f5f5e
support.function
support.constant
support.type, support.class
support.other.variable
meta.diff, meta.diff.header
markup.deleted#b85227
markup.inserted#91a51f
markup.changed#277eb8
constant.numeric.line-number.find-in-files - match#a4a3a1
entity.name.filename.find-in-files#1a1a19
sublimelinter.mark.warning#DDB700
sublimelinter.gutter-mark#FFFFFF
sublimelinter.mark.error#D02000
Komorebi-ascetic by gotorion - VS Code Theme