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#e6dec9
  • activityBar.border#c7bba0
  • activityBar.foreground#2e7d32
  • activityBar.inactiveForeground#59544c
  • activityBarBadge.background#2e7d32
  • activityBarBadge.foreground#ffffff
  • badge.background#2e7d32
  • badge.foreground#ffffff
  • breadcrumb.activeSelectionForeground#2e7d32
  • breadcrumb.focusForeground#2e7d32
  • breadcrumb.foreground#59544c
  • button.background#2e7d32
  • button.foreground#ffffff
  • button.hoverBackground#1b5e20
  • dropdown.background#faf7ee
  • dropdown.border#c7bba0
  • dropdown.foreground#181716
  • editor.background#f2ecdb
  • editor.findMatchBackground#b5890060
  • editor.findMatchHighlightBackground#b5890030
  • editor.foreground#181716
  • editor.inactiveSelectionBackground#c7bba040
  • editor.selectionBackground#2e7d3230
  • editor.selectionHighlightBackground#2e7d3215
  • editor.wordHighlightBackground#1565c020
  • editorCursor.foreground#2e7d32
  • editorGroupHeader.border#c7bba0
  • editorGroupHeader.tabsBackground#e6dec9
  • editorLineNumber.activeForeground#2e7d32
  • editorLineNumber.foreground#59544c
  • focusBorder#2e7d32
  • foreground#181716
  • gitDecoration.deletedResourceForeground#c62828
  • gitDecoration.modifiedResourceForeground#b58900
  • gitDecoration.untrackedResourceForeground#2e7d32
  • input.background#faf7ee
  • input.border#c7bba0
  • input.foreground#181716
  • input.placeholderForeground#59544c
  • list.activeSelectionBackground#c7bba060
  • list.activeSelectionForeground#2e7d32
  • list.hoverBackground#d8cdb4
  • list.inactiveSelectionBackground#d8cdb4
  • sideBar.background#e6dec9
  • sideBar.border#c7bba0
  • sideBar.foreground#181716
  • sideBarSectionHeader.background#e6dec9
  • sideBarSectionHeader.foreground#2e7d32
  • sideBarTitle.foreground#181716
  • statusBar.background#d8cdb4
  • statusBar.debuggingBackground#d84315
  • statusBar.debuggingForeground#ffffff
  • statusBar.foreground#2e7d32
  • statusBar.noFolderBackground#e6dec9
  • statusBarItem.hoverBackground#d8cdb4
  • tab.activeBackground#f2ecdb
  • tab.activeBorder#2e7d32
  • tab.activeForeground#181716
  • tab.border#c7bba0
  • tab.hoverBackground#d8cdb4
  • tab.inactiveBackground#e6dec9
  • tab.inactiveForeground#59544c
  • terminal.ansiBlack#181716
  • terminal.ansiBlue#1565c0
  • terminal.ansiBrightBlack#59544c
  • terminal.ansiBrightBlue#1565c0
  • terminal.ansiBrightCyan#00695c
  • terminal.ansiBrightGreen#2e7d32
  • terminal.ansiBrightMagenta#6a1b9a
  • terminal.ansiBrightRed#c62828
  • terminal.ansiBrightWhite#181716
  • terminal.ansiBrightYellow#b58900
  • terminal.ansiCyan#00695c
  • terminal.ansiGreen#2e7d32
  • terminal.ansiMagenta#6a1b9a
  • terminal.ansiRed#c62828
  • terminal.ansiWhite#706b62
  • terminal.ansiYellow#b58900
  • terminal.background#f2ecdb
  • terminal.foreground#181716
  • terminalCursor.foreground#2e7d32
  • titleBar.activeBackground#e6dec9
  • titleBar.activeForeground#181716
  • titleBar.border#c7bba0
  • titleBar.inactiveBackground#f2ecdb
  • titleBar.inactiveForeground#59544c

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#706b62italic
variable, string constant.other.placeholder#1565c0—
constant.other.color#181716—
invalid, invalid.illegal#c62828—
keyword, storage.type, storage.modifier#6a1b9a—
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#d84315—
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#c62828—
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method#1565c0—
meta.block variable.other#181716—
support.other.variable, string.other.link#ad1457—
constant.numeric, constant.language, support.constant, constant.character, constant.escape, variable.parameter, keyword.other.unit, keyword.other#d84315—
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#2e7d32—
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#b58900—
support.type#00695c—
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#4527a0—
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#1565c0—
variable.language#1565c0italic
entity.name.method.js#1565c0italic
meta.class-method.js entity.name.function.js, variable.function.constructor#1565c0—
entity.other.attribute-name#4527a0—
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#d84315italic
entity.other.attribute-name.class#4527a0—
source.sass keyword.control#1565c0—
markup.inserted#2e7d32—
markup.deleted#c62828—
markup.changed#1565c0—
string.regexp#00695c—
constant.character.escape#00695c—
*url*, *link*, *uri*—underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#6a1b9aitalic
source.js constant.other.object.key.js string.unquoted.label.js#d84315italic
source.json meta.structure.dictionary.json support.type.property-name.json#1565c0—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#6a1b9a—
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#c62828—
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#d84315—
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#2e7d32—
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#00695c—
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#4527a0—
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#b58900—
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#0277bd—
text.html.markdown, punctuation.definition.list_item.markdown#181716—
text.html.markdown markup.inline.raw.markdown#ad1457—
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#706b62—
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown#6a1b9a—
markup.italic#ad1457italic
markup.bold, markup.bold string#6a1b9abold
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#ad1457bold
markup.underline#1565c0underline
markup.quote punctuation.definition.blockquote.markdown#706b62—
markup.quote—italic
string.other.link.title.markdown#1565c0—
string.other.link.description.title.markdown#6a1b9a—
constant.other.reference.link.markdown#d84315—
markup.raw.block#ad1457—
markup.raw.block.fenced.markdown#18171615—
punctuation.definition.fenced.markdown#18171615—
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#181716—
variable.language.fenced.markdown#706b62—
meta.separator#706b62bold
markup.table#181716—