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#013f20
  • activityBarBadge.background#ffc786
  • activityBarBadge.foreground#000000
  • badge.background#d6b262
  • badge.foreground#000000
  • button.background#016d06
  • editor.background#002010
  • editor.foreground#f6f7b8
  • editorGroup.border#b9ab9b
  • editorGroupHeader.border#91ff00
  • editorGroupHeader.tabsBackground#024121
  • editorGroupHeader.tabsBorder#17be08
  • input.background#046333
  • input.border#b9ab9b
  • input.foreground#e5e6aa
  • input.placeholderForeground#e5e6aa
  • list.activeSelectionBackground#348f0098
  • list.activeSelectionIconForeground#fa9688
  • list.focusAndSelectionOutline#dbd173
  • list.focusBackground#348f00
  • list.hoverBackground#348f00
  • list.inactiveSelectionBackground#348f00
  • scrollbarSlider.activeBackground#32db08
  • scrollbarSlider.background#addf8c
  • scrollbarSlider.hoverBackground#5edf4d
  • sideBar.background#024b26
  • sideBar.border#628831
  • sideBar.foreground#e5e6aa
  • sideBarSectionHeader.background#41c40ec4
  • sideBarSectionHeader.foreground#000000
  • sideBarTitle.foreground#e5e6aa
  • statusBar.background#016d13
  • statusBar.foreground#e5e6aa
  • tab.activeBackground#76973d
  • tab.activeForeground#f7f8d1
  • tab.border#b9ab9b
  • tab.inactiveBackground#577229
  • tab.inactiveForeground#e5e6aa
  • titleBar.activeBackground#083302
  • titleBar.activeForeground#b6e0a9
  • titleBar.border#91ff00
  • titleBar.inactiveBackground#083302
  • window.activeBorder#e4c097

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#bdeec9italic
comment.block.preprocessor#bdeec9
comment.documentation, comment.block.documentation#85a877
invalid.illegal#dda4a4
keyword.operator#eee899
keyword, storage#91e9bd
storage.type, support.type#91e9bd
constant.language, support.constant, variable.language#ebdfc5
variable, support.variable#fdacc7
entity.name.function, support.function#faf174
entity.name.type, entity.other.inherited-class, support.class#afadff
entity.name.exception#ff9898
entity.name.sectionbold
constant.numeric, constant.character, constant#15ff00
string#b9c459
constant.character.escape#777777
string.regexp#4B83CD
constant.other.symbol#a8f88f
punctuation#c2c2c2
meta.attribute-value.html, string.quoted.html#e9b3eb
meta.tag.sgml.doctype, meta.tag.sgml.doctype string, meta.tag.sgml.doctype entity.name.tag, meta.tag.sgml punctuation.definition.tag.html#AAAAAA
meta.tag, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html#4afd62
entity.name.tag#b2f1c2
meta.tag entity.other.attribute-name, entity.other.attribute-name.html#e9b3ebitalic
constant.character.entity, punctuation.definition.entity#ebc4a1
meta.selector, meta.selector entity, meta.selector entity punctuation, entity.name.tag.css#dbbcec
meta.property-name, support.type.property-name#e4d167
meta.property-value, meta.property-value constant.other, support.constant.property-value#2c790d
keyword.other.importantbold
markup.changed#000000
markup.deleted#000000
markup.italicitalic
markup.error#6d2626
markup.inserted#000000
meta.link#4B83CD
markup.output, markup.raw#777777
markup.prompt#777777
markup.heading#b16a67
markup.boldbold
markup.traceback#e99494
markup.underlineunderline
markup.quote#7A3E9D
markup.list#4B83CD
markup.bold, markup.italic#448C27
markup.inline.raw#AB6526
meta.diff.range, meta.diff.index, meta.separator#434343
meta.diff.header.from-file#434343
meta.diff.header.to-file#434343

Shiki preview

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

Loading...