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#F5F2EA
  • activityBar.border#00000015
  • activityBar.foreground#7A8B52
  • activityBar.inactiveForeground#3E454C60
  • activityBarBadge.background#7A8B52
  • activityBarBadge.foreground#F5F2EA
  • button.background#7A8B52
  • button.foreground#F5F2EA
  • button.hoverBackground#7A8B52dd
  • editor.background#F5F2EA
  • editor.foreground#3E454C
  • editor.inactiveSelectionBackground#E6DEC92580
  • editor.lineHighlightBackground#FAFAF850
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#E6DEC925
  • editorCursor.foreground#7A8B52
  • editorGroupHeader.tabsBackground#FAFAF8aa
  • editorLineNumber.activeForeground#7A8B52
  • editorLineNumber.foreground#A7ACB280
  • focusBorder#7A8B52
  • foreground#3E454C
  • input.background#FAFAF8
  • input.border#00000015
  • input.foreground#3E454C
  • input.placeholderForeground#3E454C60
  • list.activeSelectionBackground#7A8B5230
  • list.activeSelectionForeground#3E454C
  • list.highlightForeground#7A8B52
  • list.hoverBackground#FAFAF840
  • list.hoverForeground#3E454C
  • list.inactiveSelectionBackground#7A8B5215
  • list.inactiveSelectionForeground#3E454C
  • selection.background#E6DEC925
  • sideBar.background#FAFAF8
  • sideBar.border#00000015
  • sideBar.foreground#3E454C
  • sideBarSectionHeader.background#FAFAF880
  • sideBarSectionHeader.foreground#3E454C
  • sideBarTitle.foreground#7A8B52
  • statusBar.background#F5F2EA
  • statusBar.border#00000015
  • statusBar.foreground#3E454C
  • statusBar.noFolderBackground#F5F2EA
  • tab.activeBackground#F5F2EA
  • tab.activeBorderTop#7A8B52
  • tab.activeForeground#3E454C
  • tab.border#00000015
  • tab.inactiveBackground#F5F2EA60
  • tab.inactiveForeground#3E454C80
  • terminal.ansiBlack#3E454C
  • terminal.ansiBlue#E6DEC9
  • terminal.ansiCyan#7C8A94
  • terminal.ansiGreen#7A8B52
  • terminal.ansiMagenta#A7ACB2
  • terminal.ansiRed#A7ACB2
  • terminal.ansiWhite#3E454C
  • terminal.ansiYellow#7C8A94
  • terminal.background#F5F2EA
  • terminal.foreground#3E454C
  • titleBar.activeBackground#F5F2EA
  • titleBar.activeForeground#3E454C
  • titleBar.border#00000015
  • titleBar.inactiveBackground#F5F2EA
  • titleBar.inactiveForeground#3E454C60
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#A7ACB2italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#E6DEC9bold
storage.type, storage.modifier#E6DEC9italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#7A8B52
string, punctuation.definition.string, string.template, meta.template.expression#7C8A94
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#A7ACB2
variable, variable.other.readwrite, variable.other.object#3E454C
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#3E454C
variable.parameter, meta.parameter#3E454Cdditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#3E454C80
keyword.operator#3E454C
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#7C8A94bold
entity.other.inherited-class#7A8B52
entity.name.tag, punctuation.definition.tag#E6DEC9
entity.other.attribute-name#7A8B52
meta.diff, meta.diff.header#A7ACB2
markup.deleted#A7ACB2
markup.inserted#7A8B52
markup.changed#7C8A94
markup.heading, markup.heading.setext, punctuation.definition.heading#7A8B52bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#7C8A94
string.other.link.title, string.other.link.description#7A8B52
markup.underline.link#A7ACB2underline
punctuation.definition.list#E6DEC9
markup.quote, punctuation.definition.quote#A7ACB2italic
Morphous Theme by Ameyanagi - VS Code Theme