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#57422a
  • activityBar.border#ffffff15
  • activityBar.foreground#7a4a2f
  • activityBar.inactiveForeground#F7F2E660
  • activityBarBadge.background#7a4a2f
  • activityBarBadge.foreground#57422a
  • button.background#7a4a2f
  • button.foreground#57422a
  • button.hoverBackground#7a4a2fdd
  • editor.background#57422a
  • editor.foreground#F7F2E6
  • editor.inactiveSelectionBackground#b98a5b3580
  • editor.lineHighlightBackground#2B221A40
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#b98a5b35
  • editorCursor.foreground#7a4a2f
  • editorGroupHeader.tabsBackground#57422add
  • editorLineNumber.activeForeground#7a4a2f
  • editorLineNumber.foreground#788a5a80
  • focusBorder#7a4a2f
  • foreground#F7F2E6
  • input.background#2B221A
  • input.border#ffffff15
  • input.foreground#F7F2E6
  • input.placeholderForeground#F7F2E660
  • list.activeSelectionBackground#7a4a2f30
  • list.activeSelectionForeground#F7F2E6
  • list.highlightForeground#7a4a2f
  • list.hoverBackground#2B221A40
  • list.hoverForeground#F7F2E6
  • list.inactiveSelectionBackground#7a4a2f15
  • list.inactiveSelectionForeground#F7F2E6
  • selection.background#b98a5b35
  • sideBar.background#2B221A
  • sideBar.border#ffffff15
  • sideBar.foreground#F7F2E6
  • sideBarSectionHeader.background#57422a80
  • sideBarSectionHeader.foreground#F7F2E6
  • sideBarTitle.foreground#7a4a2f
  • statusBar.background#57422a
  • statusBar.border#ffffff15
  • statusBar.foreground#F7F2E6
  • statusBar.noFolderBackground#57422a
  • tab.activeBackground#57422a
  • tab.activeBorderTop#7a4a2f
  • tab.activeForeground#F7F2E6
  • tab.border#ffffff15
  • tab.inactiveBackground#2B221A60
  • tab.inactiveForeground#F7F2E680
  • terminal.ansiBlack#57422a
  • terminal.ansiBlue#b98a5b
  • terminal.ansiCyan#5E7F4C
  • terminal.ansiGreen#7a4a2f
  • terminal.ansiMagenta#c28a3d
  • terminal.ansiRed#c28a3d
  • terminal.ansiWhite#F7F2E6
  • terminal.ansiYellow#5E7F4C
  • terminal.background#57422a
  • terminal.foreground#F7F2E6
  • titleBar.activeBackground#57422a
  • titleBar.activeForeground#F7F2E6
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#57422a
  • titleBar.inactiveForeground#F7F2E660
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#788a5aitalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#b98a5bbold
storage.type, storage.modifier#b98a5bitalic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#7a4a2f
string, punctuation.definition.string, string.template, meta.template.expression#5E7F4C
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#c28a3d
variable, variable.other.readwrite, variable.other.object#F7F2E6
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#F7F2E6
variable.parameter, meta.parameter#F7F2E6dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#F7F2E680
keyword.operator#F7F2E6
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#5E7F4Cbold
entity.other.inherited-class#7a4a2f
entity.name.tag, punctuation.definition.tag#b98a5b
entity.other.attribute-name#7a4a2f
meta.diff, meta.diff.header#788a5a
markup.deleted#c28a3d
markup.inserted#7a4a2f
markup.changed#5E7F4C
markup.heading, markup.heading.setext, punctuation.definition.heading#7a4a2fbold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#5E7F4C
string.other.link.title, string.other.link.description#7a4a2f
markup.underline.link#788a5aunderline
punctuation.definition.list#b98a5b
markup.quote, punctuation.definition.quote#788a5aitalic
Morphous Theme by Ameyanagi - VS Code Theme