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#eae0d5
  • activityBar.border#d1beac
  • activityBar.foreground#b84a39
  • activityBar.inactiveForeground#6b5952
  • activityBarBadge.background#b84a39
  • activityBarBadge.foreground#ffffff
  • badge.background#b84a39
  • badge.foreground#ffffff
  • breadcrumb.activeSelectionForeground#b84a39
  • breadcrumb.focusForeground#b84a39
  • breadcrumb.foreground#6b5952
  • button.background#b84a39
  • button.foreground#ffffff
  • button.hoverBackground#9c3b2d
  • dropdown.background#ffffff
  • dropdown.border#d1beac
  • dropdown.foreground#2d2421
  • editor.background#f5ede6
  • editor.findMatchBackground#c98a2c60
  • editor.findMatchHighlightBackground#c98a2c30
  • editor.foreground#2d2421
  • editor.inactiveSelectionBackground#d1beac40
  • editor.selectionBackground#b84a3930
  • editor.selectionHighlightBackground#b84a3915
  • editor.wordHighlightBackground#244f5c25
  • editorCursor.foreground#b84a39
  • editorGroupHeader.border#d1beac
  • editorGroupHeader.tabsBackground#eae0d5
  • editorLineNumber.activeForeground#b84a39
  • editorLineNumber.foreground#6b5952
  • focusBorder#b84a39
  • foreground#2d2421
  • gitDecoration.deletedResourceForeground#b84a39
  • gitDecoration.modifiedResourceForeground#c98a2c
  • gitDecoration.untrackedResourceForeground#415234
  • input.background#ffffff
  • input.border#d1beac
  • input.foreground#2d2421
  • input.placeholderForeground#6b5952
  • list.activeSelectionBackground#d1beac60
  • list.activeSelectionForeground#b84a39
  • list.hoverBackground#ded0c2
  • list.inactiveSelectionBackground#ded0c2
  • sideBar.background#eae0d5
  • sideBar.border#d1beac
  • sideBar.foreground#2d2421
  • sideBarSectionHeader.background#eae0d5
  • sideBarSectionHeader.foreground#b84a39
  • sideBarTitle.foreground#2d2421
  • statusBar.background#ded0c2
  • statusBar.debuggingBackground#d46b45
  • statusBar.debuggingForeground#ffffff
  • statusBar.foreground#b84a39
  • statusBar.noFolderBackground#eae0d5
  • statusBarItem.hoverBackground#ded0c2
  • tab.activeBackground#f5ede6
  • tab.activeBorder#b84a39
  • tab.activeForeground#2d2421
  • tab.border#d1beac
  • tab.hoverBackground#ded0c2
  • tab.inactiveBackground#eae0d5
  • tab.inactiveForeground#6b5952
  • terminal.ansiBlack#2d2421
  • terminal.ansiBlue#1f487e
  • terminal.ansiBrightBlack#6b5952
  • terminal.ansiBrightBlue#1f487e
  • terminal.ansiBrightCyan#244f5c
  • terminal.ansiBrightGreen#415234
  • terminal.ansiBrightMagenta#7d3c52
  • terminal.ansiBrightRed#b84a39
  • terminal.ansiBrightWhite#2d2421
  • terminal.ansiBrightYellow#c98a2c
  • terminal.ansiCyan#244f5c
  • terminal.ansiGreen#415234
  • terminal.ansiMagenta#7d3c52
  • terminal.ansiRed#b84a39
  • terminal.ansiWhite#857067
  • terminal.ansiYellow#c98a2c
  • terminal.background#f5ede6
  • terminal.foreground#2d2421
  • terminalCursor.foreground#b84a39
  • titleBar.activeBackground#eae0d5
  • titleBar.activeForeground#2d2421
  • titleBar.border#d1beac
  • titleBar.inactiveBackground#f5ede6
  • titleBar.inactiveForeground#6b5952

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#857067italic
variable, string constant.other.placeholder#b84a39
constant.other.color#2d2421
invalid, invalid.illegal#b84a39
keyword, storage.type, storage.modifier#7d3c52
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#d46b45
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#b84a39
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method#1f487e
meta.block variable.other#2d2421
support.other.variable, string.other.link#a64253
constant.numeric, constant.language, support.constant, constant.character, constant.escape, variable.parameter, keyword.other.unit, keyword.other#d46b45
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#415234
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#c98a2c
support.type#244f5c
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#6b435b
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#1f487e
variable.language#b84a39italic
entity.name.method.js#1f487eitalic
meta.class-method.js entity.name.function.js, variable.function.constructor#1f487e
entity.other.attribute-name#6b435b
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#d46b45italic
entity.other.attribute-name.class#6b435b
source.sass keyword.control#1f487e
markup.inserted#415234
markup.deleted#b84a39
markup.changed#1f487e
string.regexp#244f5c
constant.character.escape#244f5c
*url*, *link*, *uri*underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#7d3c52italic
source.js constant.other.object.key.js string.unquoted.label.js#d46b45italic
source.json meta.structure.dictionary.json support.type.property-name.json#1f487e
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#7d3c52
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#b84a39
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#d46b45
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#415234
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#244f5c
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#6b435b
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#c98a2c
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#3e6b7d
text.html.markdown, punctuation.definition.list_item.markdown#2d2421
text.html.markdown markup.inline.raw.markdown#a64253
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#857067
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown#7d3c52
markup.italic#a64253italic
markup.bold, markup.bold string#7d3c52bold
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#a64253bold
markup.underline#1f487eunderline
markup.quote punctuation.definition.blockquote.markdown#857067
markup.quoteitalic
string.other.link.title.markdown#1f487e
string.other.link.description.title.markdown#7d3c52
constant.other.reference.link.markdown#d46b45
markup.raw.block#a64253
markup.raw.block.fenced.markdown#2d242115
punctuation.definition.fenced.markdown#2d242115
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#2d2421
variable.language.fenced.markdown#857067
meta.separator#857067bold
markup.table#2d2421