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.activeBackground#cbd9e1
  • activityBar.background#d4e1e6
  • activityBar.foreground#2f455a
  • activityBar.inactiveForeground#7e909f
  • activityBarBadge.background#ff8847
  • badge.background#ffd0a7
  • breadcrumb.background#e3e9eb
  • button.background#00a073
  • checkbox.background#ecf4f5
  • editor.background#edf1f5
  • editor.foreground#5c5c4f
  • editor.lineHighlightBackground#f6f9fa
  • editor.selectionBackground#d0e8e7
  • editorGroupHeader.tabsBackground#dae2e4
  • list.activeSelectionBackground#cbe0e9
  • list.activeSelectionForeground#094040
  • list.activeSelectionIconForeground#19473f
  • list.hoverBackground#d8e2e6
  • list.inactiveSelectionBackground#d7e4ea
  • scrollbar.shadow#0507354a
  • scrollbarSlider.activeBackground#95b3c5
  • scrollbarSlider.background#c5d1d9
  • scrollbarSlider.hoverBackground#b3bec8
  • sideBar.background#e3e9ed
  • sideBarSectionHeader.background#d4e1e6
  • statusBar.background#31b09d
  • tab.activeBackground#edf1f5
  • tab.activeBorderTop#c6d6d6
  • tab.border#c6d6d6
  • tab.inactiveBackground#e3e9ed
  • titleBar.activeBackground#d4e1e6
  • titleBar.border#dae0e4
  • titleBar.inactiveBackground#dae0e4
  • tree.indentGuidesStroke#a9c0c0

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#AAAAAAitalic
comment.block.preprocessor#AAAAAA
comment.documentation, comment.block.documentation#00aa1f
invalid.illegal#660000
keyword.operator#e8a600
keyword, storage#009384italic
storage.type, support.type#263b99
constant.language, support.constant, variable.language#226fcc
variable, support.variable#00842c
entity.name.function, support.function#004ba7
entity.name.type, entity.other.inherited-class, support.class#a40341
entity.name.exception#660000
entity.name.sectionbold
constant.numeric, constant.character, constant#004a78
string#ca1457
constant.character.escape#777777
string.regexp#3c78c6
constant.other.symbol#26aba2
punctuation#777777
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#083041
entity.name.tag#b34500
meta.tag entity.other.attribute-name, entity.other.attribute-name.html#bb7a45italic
constant.character.entity, punctuation.definition.entity#AB6526
meta.selector, meta.selector entity, meta.selector entity punctuation, entity.name.tag.css#ad3f00
meta.property-name, support.type.property-name#125599
meta.property-value, meta.property-value constant.other, support.constant.property-value#47a721
keyword.other.importantbold
markup.changed#000000
markup.deleted#000000
markup.italicitalic
markup.error#660000
markup.inserted#000000
meta.link#4B83CD
markup.output, markup.raw#777777
markup.prompt#777777
markup.heading#AA3731
markup.boldbold
markup.traceback#660000
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
FW color theme by Featherior - VS Code Theme