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#f5f3ee
  • activityBar.border#00000015
  • activityBar.foreground#6e7f8f
  • activityBar.inactiveForeground#282f3360
  • activityBarBadge.background#6e7f8f
  • activityBarBadge.foreground#f5f3ee
  • button.background#6e7f8f
  • button.foreground#f5f3ee
  • button.hoverBackground#6e7f8fdd
  • editor.background#f5f3ee
  • editor.foreground#282f33
  • editor.inactiveSelectionBackground#8fa3922580
  • editor.lineHighlightBackground#ece9e250
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#8fa39225
  • editorCursor.foreground#6e7f8f
  • editorGroupHeader.tabsBackground#ece9e2aa
  • editorLineNumber.activeForeground#6e7f8f
  • editorLineNumber.foreground#8fa39280
  • focusBorder#6e7f8f
  • foreground#282f33
  • input.background#ece9e2
  • input.border#00000015
  • input.foreground#282f33
  • input.placeholderForeground#282f3360
  • list.activeSelectionBackground#6e7f8f30
  • list.activeSelectionForeground#282f33
  • list.highlightForeground#6e7f8f
  • list.hoverBackground#ece9e240
  • list.hoverForeground#282f33
  • list.inactiveSelectionBackground#6e7f8f15
  • list.inactiveSelectionForeground#282f33
  • selection.background#8fa39225
  • sideBar.background#ece9e2
  • sideBar.border#00000015
  • sideBar.foreground#282f33
  • sideBarSectionHeader.background#ece9e280
  • sideBarSectionHeader.foreground#282f33
  • sideBarTitle.foreground#6e7f8f
  • statusBar.background#f5f3ee
  • statusBar.border#00000015
  • statusBar.foreground#282f33
  • statusBar.noFolderBackground#f5f3ee
  • tab.activeBackground#f5f3ee
  • tab.activeBorderTop#6e7f8f
  • tab.activeForeground#282f33
  • tab.border#00000015
  • tab.inactiveBackground#f5f3ee60
  • tab.inactiveForeground#282f3380
  • terminal.ansiBlack#282f33
  • terminal.ansiBlue#8fa392
  • terminal.ansiCyan#c8bfaf
  • terminal.ansiGreen#6e7f8f
  • terminal.ansiMagenta#1c2126
  • terminal.ansiRed#1c2126
  • terminal.ansiWhite#282f33
  • terminal.ansiYellow#c8bfaf
  • terminal.background#f5f3ee
  • terminal.foreground#282f33
  • titleBar.activeBackground#f5f3ee
  • titleBar.activeForeground#282f33
  • titleBar.border#00000015
  • titleBar.inactiveBackground#f5f3ee
  • titleBar.inactiveForeground#282f3360
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#8fa392italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#8fa392bold
storage.type, storage.modifier#8fa392italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#6e7f8f
string, punctuation.definition.string, string.template, meta.template.expression#c8bfaf
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#1c2126
variable, variable.other.readwrite, variable.other.object#282f33
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#282f33
variable.parameter, meta.parameter#282f33dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#282f3380
keyword.operator#282f33
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#c8bfafbold
entity.other.inherited-class#6e7f8f
entity.name.tag, punctuation.definition.tag#8fa392
entity.other.attribute-name#6e7f8f
meta.diff, meta.diff.header#8fa392
markup.deleted#1c2126
markup.inserted#6e7f8f
markup.changed#c8bfaf
markup.heading, markup.heading.setext, punctuation.definition.heading#6e7f8fbold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#c8bfaf
string.other.link.title, string.other.link.description#6e7f8f
markup.underline.link#8fa392underline
punctuation.definition.list#8fa392
markup.quote, punctuation.definition.quote#8fa392italic