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#faf7f2
  • activityBar.border#00000015
  • activityBar.foreground#2f8a6e
  • activityBar.inactiveForeground#0f141260
  • activityBarBadge.background#2f8a6e
  • activityBarBadge.foreground#faf7f2
  • button.background#2f8a6e
  • button.foreground#faf7f2
  • button.hoverBackground#2f8a6edd
  • editor.background#faf7f2
  • editor.foreground#0f1412
  • editor.inactiveSelectionBackground#9fd9c32580
  • editor.lineHighlightBackground#e7ece650
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#9fd9c325
  • editorCursor.foreground#2f8a6e
  • editorGroupHeader.tabsBackground#e7ece6aa
  • editorLineNumber.activeForeground#2f8a6e
  • editorLineNumber.foreground#e3f0f080
  • focusBorder#2f8a6e
  • foreground#0f1412
  • input.background#e7ece6
  • input.border#00000015
  • input.foreground#0f1412
  • input.placeholderForeground#0f141260
  • list.activeSelectionBackground#2f8a6e30
  • list.activeSelectionForeground#0f1412
  • list.highlightForeground#2f8a6e
  • list.hoverBackground#e7ece640
  • list.hoverForeground#0f1412
  • list.inactiveSelectionBackground#2f8a6e15
  • list.inactiveSelectionForeground#0f1412
  • selection.background#9fd9c325
  • sideBar.background#e7ece6
  • sideBar.border#00000015
  • sideBar.foreground#0f1412
  • sideBarSectionHeader.background#e7ece680
  • sideBarSectionHeader.foreground#0f1412
  • sideBarTitle.foreground#2f8a6e
  • statusBar.background#faf7f2
  • statusBar.border#00000015
  • statusBar.foreground#0f1412
  • statusBar.noFolderBackground#faf7f2
  • tab.activeBackground#faf7f2
  • tab.activeBorderTop#2f8a6e
  • tab.activeForeground#0f1412
  • tab.border#00000015
  • tab.inactiveBackground#faf7f260
  • tab.inactiveForeground#0f141280
  • terminal.ansiBlack#0f1412
  • terminal.ansiBlue#9fd9c3
  • terminal.ansiCyan#f2ede3
  • terminal.ansiGreen#2f8a6e
  • terminal.ansiMagenta#c9b27a
  • terminal.ansiRed#c9b27a
  • terminal.ansiWhite#0f1412
  • terminal.ansiYellow#f2ede3
  • terminal.background#faf7f2
  • terminal.foreground#0f1412
  • titleBar.activeBackground#faf7f2
  • titleBar.activeForeground#0f1412
  • titleBar.border#00000015
  • titleBar.inactiveBackground#faf7f2
  • titleBar.inactiveForeground#0f141260
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#e3f0f0italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#9fd9c3bold
storage.type, storage.modifier#9fd9c3italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#2f8a6e
string, punctuation.definition.string, string.template, meta.template.expression#f2ede3
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#c9b27a
variable, variable.other.readwrite, variable.other.object#0f1412
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#0f1412
variable.parameter, meta.parameter#0f1412dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#0f141280
keyword.operator#0f1412
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#f2ede3bold
entity.other.inherited-class#2f8a6e
entity.name.tag, punctuation.definition.tag#9fd9c3
entity.other.attribute-name#2f8a6e
meta.diff, meta.diff.header#e3f0f0
markup.deleted#c9b27a
markup.inserted#2f8a6e
markup.changed#f2ede3
markup.heading, markup.heading.setext, punctuation.definition.heading#2f8a6ebold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#f2ede3
string.other.link.title, string.other.link.description#2f8a6e
markup.underline.link#e3f0f0underline
punctuation.definition.list#9fd9c3
markup.quote, punctuation.definition.quote#e3f0f0italic