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#fafaf8
  • activityBar.border#00000015
  • activityBar.foreground#cf8f85
  • activityBar.inactiveForeground#2f343860
  • activityBarBadge.background#cf8f85
  • activityBarBadge.foreground#fafaf8
  • button.background#cf8f85
  • button.foreground#fafaf8
  • button.hoverBackground#cf8f85dd
  • editor.background#fafaf8
  • editor.foreground#2f3438
  • editor.inactiveSelectionBackground#8b8c8a2580
  • editor.lineHighlightBackground#f2f0ed50
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#8b8c8a25
  • editorCursor.foreground#cf8f85
  • editorGroupHeader.tabsBackground#f2f0edaa
  • editorLineNumber.activeForeground#cf8f85
  • editorLineNumber.foreground#e7e4e080
  • focusBorder#cf8f85
  • foreground#2f3438
  • input.background#f2f0ed
  • input.border#00000015
  • input.foreground#2f3438
  • input.placeholderForeground#2f343860
  • list.activeSelectionBackground#cf8f8530
  • list.activeSelectionForeground#2f3438
  • list.highlightForeground#cf8f85
  • list.hoverBackground#f2f0ed40
  • list.hoverForeground#2f3438
  • list.inactiveSelectionBackground#cf8f8515
  • list.inactiveSelectionForeground#2f3438
  • selection.background#8b8c8a25
  • sideBar.background#f2f0ed
  • sideBar.border#00000015
  • sideBar.foreground#2f3438
  • sideBarSectionHeader.background#f2f0ed80
  • sideBarSectionHeader.foreground#2f3438
  • sideBarTitle.foreground#cf8f85
  • statusBar.background#fafaf8
  • statusBar.border#00000015
  • statusBar.foreground#2f3438
  • statusBar.noFolderBackground#fafaf8
  • tab.activeBackground#fafaf8
  • tab.activeBorderTop#cf8f85
  • tab.activeForeground#2f3438
  • tab.border#00000015
  • tab.inactiveBackground#fafaf860
  • tab.inactiveForeground#2f343880
  • terminal.ansiBlack#2f3438
  • terminal.ansiBlue#8b8c8a
  • terminal.ansiCyan#e0b2ad
  • terminal.ansiGreen#cf8f85
  • terminal.ansiMagenta#cf8f85
  • terminal.ansiRed#cf8f85
  • terminal.ansiWhite#2f3438
  • terminal.ansiYellow#e0b2ad
  • terminal.background#fafaf8
  • terminal.foreground#2f3438
  • titleBar.activeBackground#fafaf8
  • titleBar.activeForeground#2f3438
  • titleBar.border#00000015
  • titleBar.inactiveBackground#fafaf8
  • titleBar.inactiveForeground#2f343860
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#e7e4e0italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#8b8c8abold
storage.type, storage.modifier#8b8c8aitalic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#cf8f85
string, punctuation.definition.string, string.template, meta.template.expression#e0b2ad
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#cf8f85
variable, variable.other.readwrite, variable.other.object#2f3438
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#2f3438
variable.parameter, meta.parameter#2f3438dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#2f343880
keyword.operator#2f3438
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#e0b2adbold
entity.other.inherited-class#cf8f85
entity.name.tag, punctuation.definition.tag#8b8c8a
entity.other.attribute-name#cf8f85
meta.diff, meta.diff.header#e7e4e0
markup.deleted#cf8f85
markup.inserted#cf8f85
markup.changed#e0b2ad
markup.heading, markup.heading.setext, punctuation.definition.heading#cf8f85bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#e0b2ad
string.other.link.title, string.other.link.description#cf8f85
markup.underline.link#e7e4e0underline
punctuation.definition.list#8b8c8a
markup.quote, punctuation.definition.quote#e7e4e0italic