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#011926
  • activityBar.foreground#027cff
  • activityBarBadge.background#ff0000
  • badge.background#008bfd
  • breadcrumb.background#012850
  • breadcrumb.foreground#0487e4
  • button.background#042f94
  • button.hoverBackground#0245df
  • dropdown.background#012b42
  • editor.background#011926
  • editor.findMatchBackground#3300ff7d
  • editor.foreground#025858
  • editor.wordHighlightBackground#00d0ff68
  • editorGroup.dropBackground#14169d80
  • editorGroupHeader.noTabsBackground#14169d80
  • editorGroupHeader.tabsBackground#002c43ab
  • editorHoverWidget.background#01213b
  • editorHoverWidget.foreground#ffffff
  • editorLineNumber.activeForeground#04d1ff
  • editorLineNumber.foreground#0288db
  • editorSuggestWidget.background#043dae
  • editorSuggestWidget.foreground#88a4f6
  • editorSuggestWidget.highlightForeground#00aaff
  • editorSuggestWidget.selectedBackground#0073a8
  • editorSuggestWidget.selectedForeground#08003b
  • editorWidget.background#001e36
  • input.background#012b42
  • inputOption.hoverBackground#026397
  • list.activeSelectionBackground#1f00a7
  • list.highlightForeground#02447d
  • list.inactiveSelectionBackground#01539a65
  • list.inactiveSelectionForeground#00d9ff
  • notificationCenterHeader.background#012381
  • notifications.background#001b3e
  • notifications.foreground#edf2f6
  • panelTitle.activeBorder#038eff
  • progressBar.background#249bfc
  • scrollbarSlider.activeBackground#0177a5
  • scrollbarSlider.background#0002348b
  • scrollbarSlider.hoverBackground#0207aa
  • searchEditor.findMatchBackground#3300ff7d
  • sideBar.background#001e36
  • sideBar.foreground#00b7ff
  • sideBarTitle.foreground#03c8f9
  • statusBar.background#001d7b
  • tab.activeBackground#002e53
  • tab.activeForeground#02c5d7
  • tab.inactiveBackground#001a2f
  • tab.inactiveForeground#007188
  • terminal.foreground#02c5d7
  • titleBar.activeBackground#012381
  • titleBar.activeForeground#03eeff
  • window.activeBorder#000648

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#4e88a3italic
variable, string constant.other.placeholder#00ffff
constant.other.color#00aaff
invalid, invalid.illegal#a5011c
keyword, storage.type, storage.modifier#d871fa
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#7e5aff
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#43979b
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method#3676ff
meta.block variable.other#7c6bff
support.other.variable, string.other.link#5caff8f0
constant.numeric, constant.language, support.constant, constant.character, constant.escape, variable.parameter, keyword.other.unit, keyword.other#007efd
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#7abbfc
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#0073ff
support.type#4c7e93
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#007bac
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#472cf7ab
variable.language#4e5eecitalic
entity.name.method.js#4c3bffitalic
meta.class-method.js entity.name.function.js, variable.function.constructor#2f71ff
entity.other.attribute-name#7a56ff
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#6987ffitalic
entity.other.attribute-name.class#04d9ff
source.sass keyword.control#0043d4
markup.inserted#3ab0ff
markup.deleted#f33756
markup.changed#C792EA
string.regexp#89DDFF
constant.character.escape#89DDFF
*url*, *link*, *uri*underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#214ba8italic
source.js constant.other.object.key.js string.unquoted.label.js#FF5370italic
source.json meta.structure.dictionary.json support.type.property-name.json#b7a5f8
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#00d4f9
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#00c2fd
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#9200f4
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#0077ff
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#4a30f1
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#0077ff
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#60039d
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#54007d
text.html.markdown, punctuation.definition.list_item.markdown#33cfcf
text.html.markdown markup.inline.raw.markdown#af36ff
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#0c61a2
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown#0073ff
markup.italic#534bcaitalic
markup.bold, markup.bold string#0014f4bold
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#622326bold
markup.underline#504af5underline
markup.quote punctuation.definition.blockquote.markdown#3b576c
markup.quoteitalic
string.other.link.title.markdown#476bb8
string.other.link.description.title.markdown#C792EA
constant.other.reference.link.markdown#001eff98
markup.raw.block#C792EA
markup.raw.block.fenced.markdown#13004850
punctuation.definition.fenced.markdown#00000050
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#46ffff
variable.language.fenced.markdown#17344b
meta.separator#65737Ebold
markup.table#79ffff