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#f8f7f4
  • activityBar.border#00000015
  • activityBar.foreground#e6c789
  • activityBar.inactiveForeground#28241e60
  • activityBarBadge.background#e6c789
  • activityBarBadge.foreground#f8f7f4
  • button.background#e6c789
  • button.foreground#f8f7f4
  • button.hoverBackground#e6c789dd
  • editor.background#f8f7f4
  • editor.foreground#28241e
  • editor.inactiveSelectionBackground#f3e9d62580
  • editor.lineHighlightBackground#fff8ec50
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#f3e9d625
  • editorCursor.foreground#e6c789
  • editorGroupHeader.tabsBackground#fff8ecaa
  • editorLineNumber.activeForeground#e6c789
  • editorLineNumber.foreground#d9c9a780
  • focusBorder#e6c789
  • foreground#28241e
  • input.background#fff8ec
  • input.border#00000015
  • input.foreground#28241e
  • input.placeholderForeground#28241e60
  • list.activeSelectionBackground#e6c78930
  • list.activeSelectionForeground#28241e
  • list.highlightForeground#e6c789
  • list.hoverBackground#fff8ec40
  • list.hoverForeground#28241e
  • list.inactiveSelectionBackground#e6c78915
  • list.inactiveSelectionForeground#28241e
  • selection.background#f3e9d625
  • sideBar.background#fff8ec
  • sideBar.border#00000015
  • sideBar.foreground#28241e
  • sideBarSectionHeader.background#fff8ec80
  • sideBarSectionHeader.foreground#28241e
  • sideBarTitle.foreground#e6c789
  • statusBar.background#f8f7f4
  • statusBar.border#00000015
  • statusBar.foreground#28241e
  • statusBar.noFolderBackground#f8f7f4
  • tab.activeBackground#f8f7f4
  • tab.activeBorderTop#e6c789
  • tab.activeForeground#28241e
  • tab.border#00000015
  • tab.inactiveBackground#f8f7f460
  • tab.inactiveForeground#28241e80
  • terminal.ansiBlack#28241e
  • terminal.ansiBlue#f3e9d6
  • terminal.ansiCyan#ede6d6
  • terminal.ansiGreen#e6c789
  • terminal.ansiMagenta#785a3a
  • terminal.ansiRed#785a3a
  • terminal.ansiWhite#28241e
  • terminal.ansiYellow#ede6d6
  • terminal.background#f8f7f4
  • terminal.foreground#28241e
  • titleBar.activeBackground#f8f7f4
  • titleBar.activeForeground#28241e
  • titleBar.border#00000015
  • titleBar.inactiveBackground#f8f7f4
  • titleBar.inactiveForeground#28241e60
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#d9c9a7italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#f3e9d6bold
storage.type, storage.modifier#f3e9d6italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#e6c789
string, punctuation.definition.string, string.template, meta.template.expression#ede6d6
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#785a3a
variable, variable.other.readwrite, variable.other.object#28241e
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#28241e
variable.parameter, meta.parameter#28241edditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#28241e80
keyword.operator#28241e
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#ede6d6bold
entity.other.inherited-class#e6c789
entity.name.tag, punctuation.definition.tag#f3e9d6
entity.other.attribute-name#e6c789
meta.diff, meta.diff.header#d9c9a7
markup.deleted#785a3a
markup.inserted#e6c789
markup.changed#ede6d6
markup.heading, markup.heading.setext, punctuation.definition.heading#e6c789bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#ede6d6
string.other.link.title, string.other.link.description#e6c789
markup.underline.link#d9c9a7underline
punctuation.definition.list#f3e9d6
markup.quote, punctuation.definition.quote#d9c9a7italic