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#131516
  • activityBar.background#131516
  • activityBar.border#171a1c
  • activityBarBadge.background#21303a
  • activityBarBadge.foreground#CBD1DA
  • debugExceptionWidget.background#21303a
  • debugExceptionWidget.border#21303a
  • debugToolBar.background#171a1c
  • debugToolBar.border#171a1c
  • dropdown.background#1a1e20
  • editor.background#171a1c
  • editor.findMatchBackground#2d6970
  • editor.findMatchHighlightBackground#273c49
  • editor.foreground#CBD1DA
  • editor.lineHighlightBackground#23282b
  • editor.selectionBackground#21303a
  • editor.wordHighlightBackground#273c49
  • editorBracketMatch.border#566077
  • editorGroupHeader.noTabsBackground#131516
  • editorGroupHeader.tabsBackground#131516
  • editorHoverWidget.background#24292d
  • editorMarkerNavigation.background#18242c
  • editorMarkerNavigationError.background#21303a
  • editorMarkerNavigationError.headerBackground#21303a
  • editorMarkerNavigationInfo.background#21303a
  • editorMarkerNavigationInfo.headerBackground#21303a
  • editorMarkerNavigationWarning.background#21303a
  • editorMarkerNavigationWarning.headerBackground#21303a
  • editorWidget.background#171a1c
  • editorWidget.border#171a1c
  • focusBorder#738b9b
  • input.background#212628
  • list.activeSelectionBackground#21303a
  • list.errorForeground#E15362
  • list.hoverBackground#23282b
  • list.inactiveSelectionBackground#23282b
  • list.warningForeground#e69e4c
  • panel.background#131516
  • panel.border#131516
  • peekView.border#171a1c
  • peekViewEditor.background#18242c
  • peekViewEditor.matchHighlightBackground#273c49
  • peekViewResult.background#18242c
  • peekViewResult.matchHighlightBackground#2d6970
  • peekViewTitle.background#21303a
  • scrollbarSlider.activeBackground#21303a
  • scrollbarSlider.background#21303a
  • sideBar.background#131516
  • sideBar.border#131516
  • sideBarSectionHeader.background#131516
  • sideBarTitle.foreground#707a8f
  • statusBar.background#131516
  • statusBar.debuggingBackground#131516
  • statusBar.foreground#CBD1DA
  • statusBar.noFolderBackground#131516
  • tab.activeBackground#1a1e20
  • tab.activeBorder#51596b
  • tab.inactiveBackground#131516
  • titleBar.activeBackground#131516
  • titleBar.inactiveBackground#131516

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#707a8f
variable, string constant.other.placeholder#CBD1DA
constant.other.color#CBD1DA
invalid, invalid.illegal#E15362
keyword, storage.type, storage.modifier#6699cc
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#6699cc
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#E15362
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method#CBD1DA
meta.block variable.other#CBD1DA
support.other.variable, string.other.link#6699cc
constant.numeric, constant.language, support.constant, constant.character, constant.escape, variable.parameter, keyword.other.unit, keyword.other#e69e4c
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#5AAFAD
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#E15362
support.type#6699cc
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#6699cc
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#6699cc
variable.language#6699ccitalic
entity.name.method.js#6699ccitalic
meta.class-method.js entity.name.function.js, variable.function.constructor#6699cc
entity.other.attribute-name#6699cc
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#6699ccitalic
entity.other.attribute-name.class#6699cc
source.sass keyword.control#6699cc
markup.inserted#6699cc
markup.deleted#E15362
markup.changed#5AAFAD
string.regexp#5AAFAD
constant.character.escape#5AAFAD
*url*, *link*, *uri*underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#E15362italic
source.js constant.other.object.key.js string.unquoted.label.js#6699ccitalic
source.json meta.structure.dictionary.json support.type.property-name.json#6699cc
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#6699cc
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#6699cc
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#6699cc
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#6699cc
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#6699cc
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#6699cc
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#6699cc
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#6699cc
text.html.markdown, punctuation.definition.list_item.markdown#CBD1DA
text.html.markdown markup.inline.raw.markdown#6699cc
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#6699cc
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown#6699cc
markup.italic#6699ccitalic
markup.bold, markup.bold string#6699ccbold
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#6699ccbold
markup.underline#6699ccunderline
markup.quote punctuation.definition.blockquote.markdown#6699cc
markup.quoteitalic
string.other.link.title.markdown#6699cc
string.other.link.description.title.markdown#C792EA
constant.other.reference.link.markdown#6699cc
markup.raw.block#6699cc
markup.raw.block.fenced.markdown#00000050
punctuation.definition.fenced.markdown#00000050
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#707a8f
variable.language.fenced.markdown#707a8f
meta.separator#707a8fbold
markup.table#CBD1DA