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#090807
  • activityBar.border#3d332e40
  • activityBar.foreground#ffd700
  • activityBar.inactiveForeground#8a7b75
  • activityBarBadge.background#ffd700
  • activityBarBadge.foreground#090807
  • button.background#ffd700
  • button.foreground#090807
  • button.hoverBackground#ffe57f
  • chat.avatarBackground#ffd700
  • chat.avatarForeground#090807
  • chat.background#090807
  • chat.border#3d332e40
  • chat.replyBackground#090807
  • chat.requestBackground#13100e
  • editor.background#0e0c0a
  • editor.foreground#f4eae0
  • editor.inactiveSelectionBackground#ffd70012
  • editor.lineHighlightBackground#181411
  • editor.lineHighlightBorder#ffffff00
  • editor.selectionBackground#ffd7002d
  • editorCursor.foreground#ffd700
  • editorGroupHeader.tabsBackground#090807
  • editorGroupHeader.tabsBorder#3d332e40
  • editorWidget.background#0e0c0a
  • editorWidget.border#3d332ea0
  • input.background#13100e
  • input.border#3d332ea0
  • input.foreground#f4eae0
  • input.placeholderForeground#8a7b7580
  • inputOption.activeBorder#ffd700
  • interactive.activeCodeBorder#ffd700
  • interactive.background#0e0c0a
  • interactive.inactiveCodeBorder#3d332e40
  • list.activeSelectionBackground#181411
  • list.activeSelectionForeground#ffd700
  • list.focusBackground#181411
  • list.highlightForeground#ffe57f
  • list.hoverBackground#13100e88
  • list.inactiveSelectionBackground#13100e88
  • list.inactiveSelectionForeground#b5a296
  • panel.background#090807
  • panel.border#3d332e40
  • panelTitle.activeBorder#ffd700
  • panelTitle.activeForeground#ffd700
  • panelTitle.inactiveForeground#8a7b75
  • scrollbarSlider.activeBackground#ffd70035
  • scrollbarSlider.background#ffd70010
  • scrollbarSlider.hoverBackground#ffd70022
  • sideBar.background#090807
  • sideBar.border#3d332e40
  • sideBar.foreground#b5a296
  • sideBarSectionHeader.background#13100e
  • sideBarSectionHeader.border#3d332e15
  • sideBarSectionHeader.foreground#f4eae0
  • sideBarTitle.foreground#ffd700
  • statusBar.background#090807
  • statusBar.border#3d332e40
  • statusBar.foreground#ffd700
  • statusBar.noFolderBackground#090807
  • tab.activeBackground#0e0c0a
  • tab.activeBorder#ffd700
  • tab.activeForeground#ffd700
  • tab.border#3d332e15
  • tab.inactiveBackground#090807
  • tab.inactiveForeground#8a7b75
  • terminal.ansiCyan#ffd700
  • terminal.background#090807
  • terminal.border#3d332e40
  • terminal.foreground#f4eae0
  • titleBar.activeBackground#090807
  • titleBar.activeForeground#ffd700
  • titleBar.border#3d332e40
  • titleBar.inactiveBackground#090807
  • titleBar.inactiveForeground#8a7b75
  • widget.border#3d332ea0

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#8a7b75italic
variable, string constant.other.placeholder, variable.other.readwrite, variable.other.object, variable.other, variable.other.member#f4eae0
constant.other.color#ffffff
invalid, invalid.illegal#ff7675
keyword, storage.type, storage.modifier, keyword.control#ffab91
constant.other.color, punctuation, meta.tag, punctuation.definition.tag, punctuation.separator.inheritance.php, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, punctuation.section.embedded, keyword.other.template, keyword.other.substitution, keyword.operator#e38e65
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#ffd700
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method#ffd700
meta.block variable.other#f4eae0
support.other.variable, string.other.link#ffab91
constant.numeric, constant.language, support.constant, constant.character, constant.escape, variable.parameter, keyword.other.unit, keyword.other#ff7675
string, constant.other.symbol, constant.other.key, entity.other.inherited-class, markup.heading, markup.inserted.git_gutter, meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js#ffe599
entity.name, support.type, support.class, support.other.namespace.use.php, meta.use.php, support.other.namespace.php, markup.changed.git_gutter, support.type.sys-types, entity.name.type#e38e65
support.type#e38e65
source.css support.type.property-name, source.sass support.type.property-name, source.scss support.type.property-name, source.less support.type.property-name, source.stylus support.type.property-name, source.postcss support.type.property-name#e38e65
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#ffd700
variable.language#ffd700italic
entity.name.method.js#ffd700italic
meta.class-method.js entity.name.function.js, variable.function.constructor#ffd700
entity.other.attribute-name#ffab91
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#e38e65italic
entity.other.attribute-name.class#e38e65
source.sass keyword.control#ffd700
markup.inserted#ffe599
markup.deleted#ff7675
markup.changed#ffab91
string.regexp#ffd700
constant.character.escape#ffd700
*url*, *link*, *uri*underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#ffd700italic
source.js constant.other.object.key.js string.unquoted.label.js#ffd700italic
source.json meta.structure.dictionary.json support.type.property-name.json#ffd700
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#e38e65
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#ffe599
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#ff7675
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#f4eae0
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#ffd700
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#ffd700
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#e38e65
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#ffe599
text.html.markdown, punctuation.definition.list_item.markdown#f4eae0
text.html.markdown markup.inline.raw.markdown#ff7675
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#8a7b75
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown#ffd700bold
markup.italic#ffab91italic
markup.bold, markup.bold string#ffab91bold
markup.bold markup.italic, markup.italic markup.bold, markup.quote markup.bold, markup.bold markup.italic string, markup.italic markup.bold string, markup.quote markup.bold string#ffab91bold
markup.underline#ffd700underline
markup.quote punctuation.definition.blockquote.markdown#8a7b75
markup.quoteitalic
string.other.link.title.markdown#ffd700
string.other.link.description.title.markdown#ffab91
constant.other.reference.link.markdown#ff7675
markup.raw.block#ff7675
markup.raw.block.fenced.markdown#00000050
punctuation.definition.fenced.markdown#00000050
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#f4eae0
variable.language.fenced.markdown#8a7b75
meta.separator#8a7b75bold
markup.table#f4eae0
Ethereal Themes by Ethereal-Lemons - VS Code Theme