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#06080d
  • activityBar.border#2c354540
  • activityBar.foreground#a5d6ff
  • activityBar.inactiveForeground#6a768c
  • activityBarBadge.background#a5d6ff
  • activityBarBadge.foreground#06080d
  • button.background#a5d6ff
  • button.foreground#06080d
  • button.hoverBackground#cbe5ff
  • chat.avatarBackground#a5d6ff
  • chat.avatarForeground#06080d
  • chat.background#06080d
  • chat.border#2c354540
  • chat.replyBackground#06080d
  • chat.requestBackground#0e121b
  • editor.background#0a0d14
  • editor.foreground#e6ebf5
  • editor.inactiveSelectionBackground#a5d6ff12
  • editor.lineHighlightBackground#131824
  • editor.lineHighlightBorder#ffffff00
  • editor.selectionBackground#a5d6ff2d
  • editorCursor.foreground#a5d6ff
  • editorGroupHeader.tabsBackground#06080d
  • editorGroupHeader.tabsBorder#2c354540
  • editorWidget.background#0a0d14
  • editorWidget.border#2c3545a0
  • input.background#0e121b
  • input.border#2c3545a0
  • input.foreground#e6ebf5
  • input.placeholderForeground#6a768c80
  • inputOption.activeBorder#a5d6ff
  • interactive.activeCodeBorder#a5d6ff
  • interactive.background#0a0d14
  • interactive.inactiveCodeBorder#2c354540
  • list.activeSelectionBackground#131824
  • list.activeSelectionForeground#a5d6ff
  • list.focusBackground#131824
  • list.highlightForeground#cbe5ff
  • list.hoverBackground#0e121b88
  • list.inactiveSelectionBackground#0e121b88
  • list.inactiveSelectionForeground#93a0b5
  • panel.background#06080d
  • panel.border#2c354540
  • panelTitle.activeBorder#a5d6ff
  • panelTitle.activeForeground#a5d6ff
  • panelTitle.inactiveForeground#6a768c
  • scrollbarSlider.activeBackground#a5d6ff35
  • scrollbarSlider.background#a5d6ff10
  • scrollbarSlider.hoverBackground#a5d6ff22
  • sideBar.background#06080d
  • sideBar.border#2c354540
  • sideBar.foreground#93a0b5
  • sideBarSectionHeader.background#0e121b
  • sideBarSectionHeader.border#2c354515
  • sideBarSectionHeader.foreground#e6ebf5
  • sideBarTitle.foreground#a5d6ff
  • statusBar.background#06080d
  • statusBar.border#2c354540
  • statusBar.foreground#a5d6ff
  • statusBar.noFolderBackground#06080d
  • tab.activeBackground#0a0d14
  • tab.activeBorder#a5d6ff
  • tab.activeForeground#a5d6ff
  • tab.border#2c354515
  • tab.inactiveBackground#06080d
  • tab.inactiveForeground#6a768c
  • terminal.ansiCyan#a5d6ff
  • terminal.background#06080d
  • terminal.border#2c354540
  • terminal.foreground#e6ebf5
  • titleBar.activeBackground#06080d
  • titleBar.activeForeground#a5d6ff
  • titleBar.border#2c354540
  • titleBar.inactiveBackground#06080d
  • titleBar.inactiveForeground#6a768c
  • widget.border#2c3545a0

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#6a768citalic
variable, string constant.other.placeholder, variable.other.readwrite, variable.other.object, variable.other, variable.other.member#e6ebf5
constant.other.color#ffffff
invalid, invalid.illegal#ff7096
keyword, storage.type, storage.modifier, keyword.control#d2ccff
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#89ddff
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#a5d6ff
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method#a5d6ff
meta.block variable.other#e6ebf5
support.other.variable, string.other.link#d2ccff
constant.numeric, constant.language, support.constant, constant.character, constant.escape, variable.parameter, keyword.other.unit, keyword.other#ff7096
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#a5f3ff
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#89ddff
support.type#89ddff
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#89ddff
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#a5d6ff
variable.language#a5d6ffitalic
entity.name.method.js#a5d6ffitalic
meta.class-method.js entity.name.function.js, variable.function.constructor#a5d6ff
entity.other.attribute-name#d2ccff
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#89ddffitalic
entity.other.attribute-name.class#89ddff
source.sass keyword.control#a5d6ff
markup.inserted#a5f3ff
markup.deleted#ff7096
markup.changed#d2ccff
string.regexp#a5d6ff
constant.character.escape#a5d6ff
*url*, *link*, *uri*underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#a5d6ffitalic
source.js constant.other.object.key.js string.unquoted.label.js#a5d6ffitalic
source.json meta.structure.dictionary.json support.type.property-name.json#a5d6ff
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#89ddff
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#a5f3ff
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#ff7096
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#e6ebf5
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#a5d6ff
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#a5d6ff
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#89ddff
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#a5f3ff
text.html.markdown, punctuation.definition.list_item.markdown#e6ebf5
text.html.markdown markup.inline.raw.markdown#ff7096
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#6a768c
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown#a5d6ffbold
markup.italic#d2ccffitalic
markup.bold, markup.bold string#d2ccffbold
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#d2ccffbold
markup.underline#a5d6ffunderline
markup.quote punctuation.definition.blockquote.markdown#6a768c
markup.quoteitalic
string.other.link.title.markdown#a5d6ff
string.other.link.description.title.markdown#d2ccff
constant.other.reference.link.markdown#ff7096
markup.raw.block#ff7096
markup.raw.block.fenced.markdown#00000050
punctuation.definition.fenced.markdown#00000050
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#e6ebf5
variable.language.fenced.markdown#6a768c
meta.separator#6a768cbold
markup.table#e6ebf5
Ethereal Themes by Ethereal-Lemons - VS Code Theme