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#100a1f
  • activityBar.foreground#BD93F9
  • activityBarBadge.background#F5AD63
  • activityBarBadge.foreground#FFFFFF
  • dropdown.background#0d0817
  • dropdown.border#4A148C
  • dropdown.foreground#d1c7e8
  • dropdown.listBackground#1a1329
  • dropdown.listForeground#BD93F9
  • dropdown.listHoverBackground#4A148C
  • dropdown.listHoverForeground#E1BEE7
  • editor.background#0d0817
  • editor.foreground#d1c7e8
  • editor.lineHighlightBackground#1a1329
  • editor.selectionBackground#4A148C
  • editorCursor.foreground#FF79C6
  • editorGroup.background#0d0817
  • editorGroupHeader.noTabsBackground#0d0817
  • editorGroupHeader.tabsBackground#0d0817
  • editorHoverWidget.background#0d0817
  • editorHoverWidget.border#4A148C
  • editorLineNumber.activeForeground#BD93F9
  • editorLineNumber.foreground#6A4C93
  • menu.background#120920
  • menu.foreground#d1c7e8
  • menu.selectionBackground#4A148C
  • menu.selectionBorder#F5AD63
  • menu.selectionForeground#E1BEE7
  • menu.separatorBackground#4A148C
  • panel.background#05020f
  • panel.border#4A148C
  • quickInput.background#0d0817
  • quickInput.foreground#d1c7e8
  • quickInputList.focusBackground#4A148C
  • quickInputList.focusForeground#E1BEE7
  • quickInputList.hoverBackground#1a1329
  • quickInputList.hoverForeground#d1c7e8
  • quickInputList.inactiveForeground#BD93F9
  • quickInputTitle.background#0d0817
  • scrollbarSlider.activeBackground#FF79C6
  • scrollbarSlider.background#4A148C
  • scrollbarSlider.hoverBackground#F5AD63
  • sideBar.background#0f0a1c
  • sideBar.foreground#BD93F9
  • sideBarTitle.foreground#E1BEE7
  • statusBar.background#100a1f
  • statusBar.debuggingBackground#E91E63
  • statusBar.debuggingForeground#FFFFFF
  • statusBar.foreground#E1BEE7
  • tab.activeBackground#0a0614
  • tab.activeForeground#E1BEE7
  • tab.border#4A148C
  • tab.inactiveBackground#1a1329
  • tab.inactiveForeground#BD93F9
  • titleBar.activeBackground#100a1f
  • titleBar.activeForeground#BD93F9
  • titleBar.inactiveBackground#100a1f
  • titleBar.inactiveForeground#6A4C93

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#6A4C93italic
variable, string constant.other.placeholder#d1c7e8
constant.other.color#FF79C6
invalid, invalid.illegal#FF5555
keyword, storage.type, storage.modifier#BD93F9
keyword.control, 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#F5AD63
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#E91E63
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method#F5AD63
meta.block variable.other#BD93F9
support.other.variable, string.other.link#BD93F9
constant.numeric, constant.language, support.constant, constant.character, constant.escape, variable.parameter, keyword.other.unit, keyword.other#FF79C6
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#50FA7B
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#FF79C6
support.type#BD93F9
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#BD93F9
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#E91E63
variable.language#E91E63italic
entity.name.method.js#F5AD63italic
meta.class-method.js entity.name.function.js, variable.function.constructor#F5AD63
entity.other.attribute-name#BD93F9
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#FF79C6italic
entity.other.attribute-name.class#FF79C6
source.sass keyword.control#F5AD63
markup.inserted#50FA7B
markup.deleted#E91E63
markup.changed#BD93F9
string.regexp#F5AD63
constant.character.escape#F5AD63
*url*, *link*, *uri*underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#F5AD63italic
source.js constant.other.object.key.js string.unquoted.label.js#E91E63italic
source.json meta.structure.dictionary.json support.type.property-name.json#BD93F9
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#FF79C6
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#F5AD63
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#E91E63
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#50FA7B
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#F5AD63
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#BD93F9
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#BD93F9
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 meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#50FA7B
text.html.markdown, punctuation.definition.list_item.markdown#d1c7e8
text.html.markdown markup.inline.raw.markdown#BD93F9
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#6A4C93
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown#50FA7B
markup.italic#BD93F9italic
markup.bold, markup.bold string#BD93F9bold
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#BD93F9bold
markup.underline#FF79C6underline
markup.quote punctuation.definition.blockquote.markdown#6A4C93
markup.quoteitalic
string.other.link.title.markdown#F5AD63
string.other.link.description.title.markdown#BD93F9
constant.other.reference.link.markdown#FF79C6
markup.raw.block#BD93F9
markup.raw.block.fenced.markdown#4A148C
punctuation.definition.fenced.markdown#4A148C
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#d1c7e8
variable.language.fenced.markdown#6A4C93
meta.separator#6A4C93bold
markup.table#d1c7e8