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#eef3f0
  • activityBar.border#00000015
  • activityBar.foreground#4c7a5a
  • activityBar.inactiveForeground#223b3860
  • activityBarBadge.background#4c7a5a
  • activityBarBadge.foreground#eef3f0
  • button.background#4c7a5a
  • button.foreground#eef3f0
  • button.hoverBackground#4c7a5add
  • editor.background#eef3f0
  • editor.foreground#223b38
  • editor.inactiveSelectionBackground#7a8a5f2580
  • editor.lineHighlightBackground#f8faf750
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#7a8a5f25
  • editorCursor.foreground#4c7a5a
  • editorGroupHeader.tabsBackground#f8faf7aa
  • editorLineNumber.activeForeground#4c7a5a
  • editorLineNumber.foreground#a9b3ad80
  • focusBorder#4c7a5a
  • foreground#223b38
  • input.background#f8faf7
  • input.border#00000015
  • input.foreground#223b38
  • input.placeholderForeground#223b3860
  • list.activeSelectionBackground#4c7a5a30
  • list.activeSelectionForeground#223b38
  • list.highlightForeground#4c7a5a
  • list.hoverBackground#f8faf740
  • list.hoverForeground#223b38
  • list.inactiveSelectionBackground#4c7a5a15
  • list.inactiveSelectionForeground#223b38
  • selection.background#7a8a5f25
  • sideBar.background#f8faf7
  • sideBar.border#00000015
  • sideBar.foreground#223b38
  • sideBarSectionHeader.background#f8faf780
  • sideBarSectionHeader.foreground#223b38
  • sideBarTitle.foreground#4c7a5a
  • statusBar.background#eef3f0
  • statusBar.border#00000015
  • statusBar.foreground#223b38
  • statusBar.noFolderBackground#eef3f0
  • tab.activeBackground#eef3f0
  • tab.activeBorderTop#4c7a5a
  • tab.activeForeground#223b38
  • tab.border#00000015
  • tab.inactiveBackground#eef3f060
  • tab.inactiveForeground#223b3880
  • terminal.ansiBlack#223b38
  • terminal.ansiBlue#7a8a5f
  • terminal.ansiCyan#5e8f8d
  • terminal.ansiGreen#4c7a5a
  • terminal.ansiMagenta#d1a24a
  • terminal.ansiRed#d1a24a
  • terminal.ansiWhite#223b38
  • terminal.ansiYellow#5e8f8d
  • terminal.background#eef3f0
  • terminal.foreground#223b38
  • titleBar.activeBackground#eef3f0
  • titleBar.activeForeground#223b38
  • titleBar.border#00000015
  • titleBar.inactiveBackground#eef3f0
  • titleBar.inactiveForeground#223b3860
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#a9b3aditalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#7a8a5fbold
storage.type, storage.modifier#7a8a5fitalic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#4c7a5a
string, punctuation.definition.string, string.template, meta.template.expression#5e8f8d
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#d1a24a
variable, variable.other.readwrite, variable.other.object#223b38
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#223b38
variable.parameter, meta.parameter#223b38dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#223b3880
keyword.operator#223b38
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#5e8f8dbold
entity.other.inherited-class#4c7a5a
entity.name.tag, punctuation.definition.tag#7a8a5f
entity.other.attribute-name#4c7a5a
meta.diff, meta.diff.header#a9b3ad
markup.deleted#d1a24a
markup.inserted#4c7a5a
markup.changed#5e8f8d
markup.heading, markup.heading.setext, punctuation.definition.heading#4c7a5abold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#5e8f8d
string.other.link.title, string.other.link.description#4c7a5a
markup.underline.link#a9b3adunderline
punctuation.definition.list#7a8a5f
markup.quote, punctuation.definition.quote#a9b3aditalic
Morphous Theme by Ameyanagi - VS Code Theme