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#292929
  • activityBar.foreground#ffe542
  • activityBar.inactiveForeground#cc9735
  • activityBarBadge.background#292929
  • activityBarBadge.foreground#ffffff
  • badge.background#292929
  • editor.background#292929
  • editor.findMatchBackground#f3690038
  • editor.findMatchBorder#f36900bb
  • editor.findMatchHighlightBackground#f3690038
  • editor.findMatchHighlightBorder#f3690060
  • editor.foreground#bfb9b3
  • editor.selectionBackground#345fbb
  • editor.wordHighlightBackground#bfb9b320
  • editor.wordHighlightBorder#bfb9b3bb
  • editor.wordHighlightStrongBackground#bfb9b320
  • editor.wordHighlightStrongBorder#bfb9b3bb
  • editorGroupHeader.tabsBackground#292929
  • editorInlayHint.foreground#8e8a8699
  • gitDecoration.modifiedResourceForeground#e8ba3c
  • gitDecoration.untrackedResourceForeground#b7e288
  • menu.background#4c3f34
  • menu.foreground#bfb9b3
  • menu.selectionBackground#544e4a
  • menu.selectionForeground#d8d2cb
  • menu.separatorBackground#8e8a86
  • sideBar.background#363636
  • sideBar.foreground#bfb9b3
  • sideBarTitle.foreground#bbbbbb
  • statusBar.background#000000
  • statusBar.debuggingBackground#ef924f
  • statusBar.foreground#ffffff
  • tab.activeBackground#363636
  • tab.activeBorder#ffffff
  • tab.inactiveBackground#292929
  • tab.inactiveForeground#bfb9b3
  • terminal.background#363636
  • terminal.foreground#bfb9b3
  • titleBar.activeBackground#292929
  • toolbar.activeBackground#292929

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
variable#BFB9B3
meta.object-literal.key#8E8A86italic
punctuation, meta.brace#DDD7CE
keyword.operator, storage.type.function.arrow, punctuation.terminator.statement, punctuation.separator, punctuation.comma, punctuation.other.comma, punctuation.semi, punctuation.definition.typeparameters, punctuation.brackets.angle, punctuation.accessor, punctuation.other.period, punctuation.section.angle-brackets, punctuation.vararg-ellipses#7D9599bold
storage, keyword.operator.new, keyword.operator.expression, keyword.control, keyword.local, keyword.other, keyword.function, keyword.package, keyword.struct, keyword.var, storage.type.interface, storage.type.class, storage.type.function, storage.type.rust, storage.type.type, storage.type.template, storage.type.namespace.definition, meta.var.expr storage.type, punctuation.definition.directive#DB9C69
storage.type, keyword.type, entity.name.type, entity.name.module, entity.other.inherited-class#9AEACC
support.type.primitive, entity.name.type.primitive, entity.name.type.lifetime, entity.name.type.numeric, storage.type.boolean, keyword.type#EF924F
constant.language, variable.other.enummember#BCE0D2
variable.language, keyword.other.this#EF924Fitalic
comment#7A8A8Citalic
punctuation.definition.comment#7A8A8C
entity.name.function, support.function#E0C398
string.quoted, string.template, string.other.link.title#E8BA3C
punctuation.definition.string, string.quoted.byte.raw, punctuation.definition.char#FFE542
constant.numeric#C6E288
meta.delimiter.decimal.period#88CC2A
entity.name.tag#57A7AF
entity.other.attribute-name#8E8A86
support.class.component#8FD8E0
heading, markup.heading#E8BA3Cbold
punctuation.definition.heading#FFE542bold
meta.link.inline#DDD7CE
markup.underline.link#EF924Funderline
markup.fenced_code, markup.inline.raw.string#8FD8E0
markup.fenced_code punctuation.definition, markup.inline.raw.string punctuation.definition#57A7AFbold
markup.boldbold
markup.italicitalic
markup.quote#8E8A86
token.info-token#6796E6
token.warn-token#CD9731
token.error-token#F44747
token.debug-token#B267E6
Haramosh theme by hcorta - VS Code Theme