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#151515
  • activityBar.dropBackground#252525
  • activityBarBadge.background#4b4b4b
  • activityBarBadge.foreground#e0e0e0
  • editor.background#101010
  • editor.foreground#d0d0d0
  • editorGroupHeader.tabsBackground#1d1d1d
  • editorPane.background#ff0000
  • input.background#2b2b2b
  • menu.background#171717
  • menu.foreground#d0d0d0
  • menu.selectionBackground#252525
  • menu.selectionForeground#e0e0e0
  • menu.separatorBackground#505050
  • menubar.selectionBackground#171717
  • menubar.selectionForeground#e0e0e0
  • panel.background#0f0f0f
  • panel.dropBackground#202020
  • panelTitle.activeBorder#808080
  • panelTitle.activeForeground#d0d0d0
  • sideBar.background#1d1d1d
  • sideBar.dropBackground#303030
  • sideBar.foreground#d0d0d0
  • sideBarSectionHeader.background#282828
  • sideBarSectionHeader.foreground#d0d0d0
  • sideBarTitle.foreground#bbbbbb
  • statusBar.background#454545
  • statusBar.debuggingBackground#454545
  • statusBar.debuggingForeground#e0e0e0
  • statusBar.foreground#e0e0e0
  • statusBarItem.activeBackground#202020
  • statusBarItem.hoverBackground#303030
  • tab.activeBackground#101010
  • tab.activeBorder#808080
  • tab.activeForeground#d0d0d0
  • tab.hoverBackground#202020
  • tab.hoverBorder#ababab
  • tab.inactiveBackground#1d1d1d
  • terminal.background#0f0f0f
  • terminal.foreground#b0b0b0
  • titleBar.activeBackground#292929
  • titleBar.activeForeground#d0d0d0
  • titleBar.inactiveBackground#252525

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#617180
constant.numeric#bd77c4
constant.language#bd77c4bold
constant.character#f3b839
entity.name.type#8ed878
entity.name.function#eeb438
entity.other.inherited-class#79d4ff
entity.name.tag#dd6060
entity.other.attribute-name#3a8bce
keyword.control#dd6060
keyword.operator.assignment#dd6060
keyword.operator.logical#dd6060
keyword.operator#dd6060
keyword#bd77c4
invalid#FF3030
storage#79d4ff
string.quoted#9fd685
string.regexp#ff4ff6
support.function#eeb438
support.class, support.type#9a78d8
support.type.property-name#eeb438
variable.parameter#6998d6
variable.language#ff4040
markup.heading#79ace6
markup.bold#ffa53ebold
markup.list#bae766
markup.italic#FF0000

Shiki preview

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

Loading...

Lazy Dark - Coding Theme