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#fbfaf7
  • activityBar.border#00000015
  • activityBar.foreground#eec7c7
  • activityBar.inactiveForeground#2b282660
  • activityBarBadge.background#eec7c7
  • activityBarBadge.foreground#fbfaf7
  • button.background#eec7c7
  • button.foreground#fbfaf7
  • button.hoverBackground#eec7c7dd
  • editor.background#fbfaf7
  • editor.foreground#2b2826
  • editor.inactiveSelectionBackground#879aa02580
  • editor.lineHighlightBackground#d9d3ce50
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#879aa025
  • editorCursor.foreground#eec7c7
  • editorGroupHeader.tabsBackground#d9d3ceaa
  • editorLineNumber.activeForeground#eec7c7
  • editorLineNumber.foreground#c9989a80
  • focusBorder#eec7c7
  • foreground#2b2826
  • input.background#d9d3ce
  • input.border#00000015
  • input.foreground#2b2826
  • input.placeholderForeground#2b282660
  • list.activeSelectionBackground#eec7c730
  • list.activeSelectionForeground#2b2826
  • list.highlightForeground#eec7c7
  • list.hoverBackground#d9d3ce40
  • list.hoverForeground#2b2826
  • list.inactiveSelectionBackground#eec7c715
  • list.inactiveSelectionForeground#2b2826
  • selection.background#879aa025
  • sideBar.background#d9d3ce
  • sideBar.border#00000015
  • sideBar.foreground#2b2826
  • sideBarSectionHeader.background#d9d3ce80
  • sideBarSectionHeader.foreground#2b2826
  • sideBarTitle.foreground#eec7c7
  • statusBar.background#fbfaf7
  • statusBar.border#00000015
  • statusBar.foreground#2b2826
  • statusBar.noFolderBackground#fbfaf7
  • tab.activeBackground#fbfaf7
  • tab.activeBorderTop#eec7c7
  • tab.activeForeground#2b2826
  • tab.border#00000015
  • tab.inactiveBackground#fbfaf760
  • tab.inactiveForeground#2b282680
  • terminal.ansiBlack#2b2826
  • terminal.ansiBlue#879aa0
  • terminal.ansiCyan#c9989a
  • terminal.ansiGreen#eec7c7
  • terminal.ansiMagenta#a66f65
  • terminal.ansiRed#a66f65
  • terminal.ansiWhite#2b2826
  • terminal.ansiYellow#c9989a
  • terminal.background#fbfaf7
  • terminal.foreground#2b2826
  • titleBar.activeBackground#fbfaf7
  • titleBar.activeForeground#2b2826
  • titleBar.border#00000015
  • titleBar.inactiveBackground#fbfaf7
  • titleBar.inactiveForeground#2b282660
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#c9989aitalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#879aa0bold
storage.type, storage.modifier#879aa0italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#eec7c7
string, punctuation.definition.string, string.template, meta.template.expression#c9989a
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#a66f65
variable, variable.other.readwrite, variable.other.object#2b2826
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#2b2826
variable.parameter, meta.parameter#2b2826dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#2b282680
keyword.operator#2b2826
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#c9989abold
entity.other.inherited-class#eec7c7
entity.name.tag, punctuation.definition.tag#879aa0
entity.other.attribute-name#eec7c7
meta.diff, meta.diff.header#c9989a
markup.deleted#a66f65
markup.inserted#eec7c7
markup.changed#c9989a
markup.heading, markup.heading.setext, punctuation.definition.heading#eec7c7bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#c9989a
string.other.link.title, string.other.link.description#eec7c7
markup.underline.link#c9989aunderline
punctuation.definition.list#879aa0
markup.quote, punctuation.definition.quote#c9989aitalic
Morphous Theme by Ameyanagi - VS Code Theme