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#676a68
  • activityBar.border#ffffff15
  • activityBar.foreground#c98fa0
  • activityBar.inactiveForeground#fbf8ef60
  • activityBarBadge.background#c98fa0
  • activityBarBadge.foreground#676a68
  • button.background#c98fa0
  • button.foreground#676a68
  • button.hoverBackground#c98fa0dd
  • editor.background#676a68
  • editor.foreground#fbf8ef
  • editor.inactiveSelectionBackground#aeb4b43580
  • editor.lineHighlightBackground#27252340
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#aeb4b435
  • editorCursor.foreground#c98fa0
  • editorGroupHeader.tabsBackground#676a68dd
  • editorLineNumber.activeForeground#c98fa0
  • editorLineNumber.foreground#bdb8b080
  • focusBorder#c98fa0
  • foreground#fbf8ef
  • input.background#272523
  • input.border#ffffff15
  • input.foreground#fbf8ef
  • input.placeholderForeground#fbf8ef60
  • list.activeSelectionBackground#c98fa030
  • list.activeSelectionForeground#fbf8ef
  • list.highlightForeground#c98fa0
  • list.hoverBackground#27252340
  • list.hoverForeground#fbf8ef
  • list.inactiveSelectionBackground#c98fa015
  • list.inactiveSelectionForeground#fbf8ef
  • selection.background#aeb4b435
  • sideBar.background#272523
  • sideBar.border#ffffff15
  • sideBar.foreground#fbf8ef
  • sideBarSectionHeader.background#676a6880
  • sideBarSectionHeader.foreground#fbf8ef
  • sideBarTitle.foreground#c98fa0
  • statusBar.background#676a68
  • statusBar.border#ffffff15
  • statusBar.foreground#fbf8ef
  • statusBar.noFolderBackground#676a68
  • tab.activeBackground#676a68
  • tab.activeBorderTop#c98fa0
  • tab.activeForeground#fbf8ef
  • tab.border#ffffff15
  • tab.inactiveBackground#27252360
  • tab.inactiveForeground#fbf8ef80
  • terminal.ansiBlack#676a68
  • terminal.ansiBlue#aeb4b4
  • terminal.ansiCyan#c7a86a
  • terminal.ansiGreen#c98fa0
  • terminal.ansiMagenta#d8aeb8
  • terminal.ansiRed#d8aeb8
  • terminal.ansiWhite#fbf8ef
  • terminal.ansiYellow#c7a86a
  • terminal.background#676a68
  • terminal.foreground#fbf8ef
  • titleBar.activeBackground#676a68
  • titleBar.activeForeground#fbf8ef
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#676a68
  • titleBar.inactiveForeground#fbf8ef60
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#bdb8b0italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#aeb4b4bold
storage.type, storage.modifier#aeb4b4italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#c98fa0
string, punctuation.definition.string, string.template, meta.template.expression#c7a86a
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#d8aeb8
variable, variable.other.readwrite, variable.other.object#fbf8ef
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#fbf8ef
variable.parameter, meta.parameter#fbf8efdditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#fbf8ef80
keyword.operator#fbf8ef
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#c7a86abold
entity.other.inherited-class#c98fa0
entity.name.tag, punctuation.definition.tag#aeb4b4
entity.other.attribute-name#c98fa0
meta.diff, meta.diff.header#bdb8b0
markup.deleted#d8aeb8
markup.inserted#c98fa0
markup.changed#c7a86a
markup.heading, markup.heading.setext, punctuation.definition.heading#c98fa0bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#c7a86a
string.other.link.title, string.other.link.description#c98fa0
markup.underline.link#bdb8b0underline
punctuation.definition.list#aeb4b4
markup.quote, punctuation.definition.quote#bdb8b0italic