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#f4ecd9
  • activityBar.border#00000015
  • activityBar.foreground#59653a
  • activityBar.inactiveForeground#251f1760
  • activityBarBadge.background#59653a
  • activityBarBadge.foreground#f4ecd9
  • button.background#59653a
  • button.foreground#f4ecd9
  • button.hoverBackground#59653add
  • editor.background#f4ecd9
  • editor.foreground#251f17
  • editor.inactiveSelectionBackground#d8bf8a2580
  • editor.lineHighlightBackground#7a593650
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#d8bf8a25
  • editorCursor.foreground#59653a
  • editorGroupHeader.tabsBackground#7a5936aa
  • editorLineNumber.activeForeground#59653a
  • editorLineNumber.foreground#d8bf8a80
  • focusBorder#59653a
  • foreground#251f17
  • input.background#7a5936
  • input.border#00000015
  • input.foreground#251f17
  • input.placeholderForeground#251f1760
  • list.activeSelectionBackground#59653a30
  • list.activeSelectionForeground#251f17
  • list.highlightForeground#59653a
  • list.hoverBackground#7a593640
  • list.hoverForeground#251f17
  • list.inactiveSelectionBackground#59653a15
  • list.inactiveSelectionForeground#251f17
  • selection.background#d8bf8a25
  • sideBar.background#7a5936
  • sideBar.border#00000015
  • sideBar.foreground#251f17
  • sideBarSectionHeader.background#7a593680
  • sideBarSectionHeader.foreground#251f17
  • sideBarTitle.foreground#59653a
  • statusBar.background#f4ecd9
  • statusBar.border#00000015
  • statusBar.foreground#251f17
  • statusBar.noFolderBackground#f4ecd9
  • tab.activeBackground#f4ecd9
  • tab.activeBorderTop#59653a
  • tab.activeForeground#251f17
  • tab.border#00000015
  • tab.inactiveBackground#f4ecd960
  • tab.inactiveForeground#251f1780
  • terminal.ansiBlack#251f17
  • terminal.ansiBlue#d8bf8a
  • terminal.ansiCyan#333b22
  • terminal.ansiGreen#59653a
  • terminal.ansiMagenta#8a9364
  • terminal.ansiRed#8a9364
  • terminal.ansiWhite#251f17
  • terminal.ansiYellow#333b22
  • terminal.background#f4ecd9
  • terminal.foreground#251f17
  • titleBar.activeBackground#f4ecd9
  • titleBar.activeForeground#251f17
  • titleBar.border#00000015
  • titleBar.inactiveBackground#f4ecd9
  • titleBar.inactiveForeground#251f1760
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#d8bf8aitalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#d8bf8abold
storage.type, storage.modifier#d8bf8aitalic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#59653a
string, punctuation.definition.string, string.template, meta.template.expression#333b22
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#8a9364
variable, variable.other.readwrite, variable.other.object#251f17
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#251f17
variable.parameter, meta.parameter#251f17dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#251f1780
keyword.operator#251f17
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#333b22bold
entity.other.inherited-class#59653a
entity.name.tag, punctuation.definition.tag#d8bf8a
entity.other.attribute-name#59653a
meta.diff, meta.diff.header#d8bf8a
markup.deleted#8a9364
markup.inserted#59653a
markup.changed#333b22
markup.heading, markup.heading.setext, punctuation.definition.heading#59653abold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#333b22
string.other.link.title, string.other.link.description#59653a
markup.underline.link#d8bf8aunderline
punctuation.definition.list#d8bf8a
markup.quote, punctuation.definition.quote#d8bf8aitalic