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#191d19
  • activityBar.foreground#c3c5ca
  • activityBarBadge.background#64004b
  • activityBarBadge.foreground#c1c3c5
  • badge.background#64004b
  • badge.foreground#c1c3c5
  • button.background#544051
  • button.hoverBackground#7c5c77
  • checkbox.background#64004b
  • debugToolBar.background#191d19
  • diffEditor.insertedTextBackground#00809B33
  • dropdown.background#191d19
  • dropdown.border#464646
  • editor.background#191d19
  • editor.findMatchHighlightBackground#685bbe
  • editor.lineHighlightBackground#191d19
  • editor.selectionBackground#5f715c
  • editor.selectionHighlightBackground#35493447
  • editor.wordHighlightBackground#35493447
  • editor.wordHighlightStrongBackground#AAB1C026
  • editorBracketHighlight.foreground1#b89c69
  • editorBracketHighlight.foreground2#d68c8b
  • editorBracketHighlight.foreground3#c78cc7
  • editorBracketHighlight.foreground4#85a0d6
  • editorBracketHighlight.foreground5#48acc8
  • editorBracketHighlight.foreground6#27b6a6
  • editorCursor.foreground#00f7ffbb
  • editorError.foreground#c24038
  • editorGroup.border#464646
  • editorGroupHeader.tabsBackground#191d19
  • editorHoverWidget.background#191d19
  • editorHoverWidget.border#464646
  • editorIndentGuide.background#3B4048
  • editorLineNumber.foreground#495162
  • editorMarkerNavigation.background#21252b
  • editorRuler.foreground#AAB1C026
  • editorSuggestWidget.background#191d19
  • editorSuggestWidget.border#464646
  • editorSuggestWidget.selectedBackground#464646
  • editorWhitespace.foreground#3f3f3f
  • editorWidget.background#21252B
  • focusBorder#544051
  • foreground#d0c9d0
  • input.background#1d1f23
  • list.activeSelectionBackground#2c313a
  • list.activeSelectionForeground#d7dae0
  • list.dropBackground#3a2037
  • list.focusBackground#383E4A
  • list.highlightForeground#C5C5C5
  • list.hoverBackground#292d35
  • list.inactiveSelectionBackground#2c313a
  • list.inactiveSelectionForeground#d7dae0
  • minimap.findMatchHighlight#443b7a
  • minimap.selectionHighlight#354934
  • notificationLink.foreground#544051
  • peekViewEditor.matchHighlightBackground#29244b
  • scrollbarSlider.activeBackground#747D9180
  • scrollbarSlider.background#4E566680
  • scrollbarSlider.hoverBackground#5A637580
  • settings.modifiedItemIndicator#64004b
  • sideBar.background#191d19
  • sideBarSectionHeader.background#282c34
  • statusBar.background#191d19
  • statusBar.debuggingBackground#191d19
  • statusBar.foreground#9da5b4
  • statusBar.noFolderBackground#191d19
  • statusBarItem.hoverBackground#2c313a
  • tab.activeBackground#191d19
  • tab.activeModifiedBorder#e6ade6
  • tab.border#464646
  • tab.inactiveBackground#191d19
  • tab.inactiveModifiedBorder#bb9abb
  • terminal.ansiBlack#2D3139
  • terminal.ansiBlue#2e8ccf
  • terminal.ansiGreen#98c379ff
  • terminal.ansiYellow#B4881D
  • terminal.foreground#C8C8C8
  • textBlockQuote.border#64004b
  • textLink.activeForeground#faabe0
  • textLink.foreground#d680bb
  • titleBar.activeBackground#191d19
  • titleBar.activeForeground#9da5b4
  • titleBar.inactiveBackground#191d19
  • titleBar.inactiveForeground#6B717D
  • welcomePage.buttonBackground#544051
  • welcomePage.buttonHoverBackground#7c5c77
  • welcomePage.progress.foreground#faabe0
  • widget.shadow#393a39

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#e6ade6
variable, string constant.other.placeholder#FAEAAB
invalid.deprecated#eaff2e
invalid.illegal#dc8a7b
constant.other.color#CEEEA8
keyword, storage.type, storage.modifier#38b4aa
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#b89c69
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#f0f0f0
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method#cccccc
meta.block variable.other#cccccc
support.other.variable, string.other.link#cccccc
constant.numeric, constant.language, support.constant, constant.character, constant.escape, variable.parameter, keyword.other.unit, keyword.other#5ab8cf
string, punctuation.definition.string.begin, punctuation.definition.string.end, 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#C3E88D
entity.name, support.type, support.class, support.orther.namespace.use.php, meta.use.php, support.other.namespace.php, markup.changed.git_gutter, support.type.sys-types#6b8eff
support.type#B2CCD6
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#B2CCD6
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#158a4f
variable.language#158a4f
entity.name.method.js#82AAFFitalic
meta.class-method.js entity.name.function.js, variable.function.constructor#82AAFF
entity.other.attribute-name#C792EA
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#b89c69italic
entity.other.attribute-name.class#b89c69
source.sass keyword.control#82AAFF
markup.inserted#C3E88D
markup.deleted#FF5370
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#82AAFFitalic
source.js constant.other.object.key.js string.unquoted.label.js#FF5370italic
source.json meta.structure.dictionary.json support.type.property-name.json#b89c69
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#d09179
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#d68b99
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#bf91bf
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#8f9ed5
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#54a9cf
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#45afb3
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#69ad8d
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#98a66e
text.html.markdown, punctuation.definition.list_item.markdown#cccccc
text.html.markdown markup.inline.raw.markdown#C792EA
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#65737E
text.html.markdown meta.dummy.line-break#111
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown#C3E88D
markup.italic#f07178italic
markup.bold, markup.bold string#f07178bold
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#f07178bold
markup.underline#F78C6Cunderline
markup.strike#F78C6C
markup.quote punctuation.definition.blockquote.markdown#65737E
markup.quoteitalic
string.other.link.title.markdown#82AAFF
string.other.link.description.title.markdown#C792EA
constant.other.reference.link.markdown#b89c69
markup.raw.block#C792EA
markup.raw.block.fenced.markdown#191d1950
punctuation.definition.fenced.markdown#191d1950
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#EEFFFF
variable.language.fenced.markdown#65737E
meta.separator#65737E50bold
markup.table#EEFFFF
token.info-token#67d3e6
token.warn-token#cd9731
token.error-token#f44747
token.debug-token#b267e6