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#fff8e6
  • activityBar.border#00000015
  • activityBar.foreground#f4b43f
  • activityBar.inactiveForeground#24221c60
  • activityBarBadge.background#f4b43f
  • activityBarBadge.foreground#fff8e6
  • button.background#f4b43f
  • button.foreground#fff8e6
  • button.hoverBackground#f4b43fdd
  • editor.background#fff8e6
  • editor.foreground#24221c
  • editor.inactiveSelectionBackground#9aa0a22580
  • editor.lineHighlightBackground#e8dcc050
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#9aa0a225
  • editorCursor.foreground#f4b43f
  • editorGroupHeader.tabsBackground#e8dcc0aa
  • editorLineNumber.activeForeground#f4b43f
  • editorLineNumber.foreground#9aa0a280
  • focusBorder#f4b43f
  • foreground#24221c
  • input.background#e8dcc0
  • input.border#00000015
  • input.foreground#24221c
  • input.placeholderForeground#24221c60
  • list.activeSelectionBackground#f4b43f30
  • list.activeSelectionForeground#24221c
  • list.highlightForeground#f4b43f
  • list.hoverBackground#e8dcc040
  • list.hoverForeground#24221c
  • list.inactiveSelectionBackground#f4b43f15
  • list.inactiveSelectionForeground#24221c
  • selection.background#9aa0a225
  • sideBar.background#e8dcc0
  • sideBar.border#00000015
  • sideBar.foreground#24221c
  • sideBarSectionHeader.background#e8dcc080
  • sideBarSectionHeader.foreground#24221c
  • sideBarTitle.foreground#f4b43f
  • statusBar.background#fff8e6
  • statusBar.border#00000015
  • statusBar.foreground#24221c
  • statusBar.noFolderBackground#fff8e6
  • tab.activeBackground#fff8e6
  • tab.activeBorderTop#f4b43f
  • tab.activeForeground#24221c
  • tab.border#00000015
  • tab.inactiveBackground#fff8e660
  • tab.inactiveForeground#24221c80
  • terminal.ansiBlack#24221c
  • terminal.ansiBlue#9aa0a2
  • terminal.ansiCyan#d98a1c
  • terminal.ansiGreen#f4b43f
  • terminal.ansiMagenta#3f8f72
  • terminal.ansiRed#3f8f72
  • terminal.ansiWhite#24221c
  • terminal.ansiYellow#d98a1c
  • terminal.background#fff8e6
  • terminal.foreground#24221c
  • titleBar.activeBackground#fff8e6
  • titleBar.activeForeground#24221c
  • titleBar.border#00000015
  • titleBar.inactiveBackground#fff8e6
  • titleBar.inactiveForeground#24221c60
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#9aa0a2italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#9aa0a2bold
storage.type, storage.modifier#9aa0a2italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#f4b43f
string, punctuation.definition.string, string.template, meta.template.expression#d98a1c
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#3f8f72
variable, variable.other.readwrite, variable.other.object#24221c
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#24221c
variable.parameter, meta.parameter#24221cdditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#24221c80
keyword.operator#24221c
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#d98a1cbold
entity.other.inherited-class#f4b43f
entity.name.tag, punctuation.definition.tag#9aa0a2
entity.other.attribute-name#f4b43f
meta.diff, meta.diff.header#9aa0a2
markup.deleted#3f8f72
markup.inserted#f4b43f
markup.changed#d98a1c
markup.heading, markup.heading.setext, punctuation.definition.heading#f4b43fbold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#d98a1c
string.other.link.title, string.other.link.description#f4b43f
markup.underline.link#9aa0a2underline
punctuation.definition.list#9aa0a2
markup.quote, punctuation.definition.quote#9aa0a2italic