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#f3f7f2
  • activityBar.border#00000015
  • activityBar.foreground#7f9f76
  • activityBar.inactiveForeground#26302b60
  • activityBarBadge.background#7f9f76
  • activityBarBadge.foreground#f3f7f2
  • button.background#7f9f76
  • button.foreground#f3f7f2
  • button.hoverBackground#7f9f76dd
  • editor.background#f3f7f2
  • editor.foreground#26302b
  • editor.inactiveSelectionBackground#b6c99a2580
  • editor.lineHighlightBackground#e8efe350
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#b6c99a25
  • editorCursor.foreground#7f9f76
  • editorGroupHeader.tabsBackground#e8efe3aa
  • editorLineNumber.activeForeground#7f9f76
  • editorLineNumber.foreground#b6c99a80
  • focusBorder#7f9f76
  • foreground#26302b
  • input.background#e8efe3
  • input.border#00000015
  • input.foreground#26302b
  • input.placeholderForeground#26302b60
  • list.activeSelectionBackground#7f9f7630
  • list.activeSelectionForeground#26302b
  • list.highlightForeground#7f9f76
  • list.hoverBackground#e8efe340
  • list.hoverForeground#26302b
  • list.inactiveSelectionBackground#7f9f7615
  • list.inactiveSelectionForeground#26302b
  • selection.background#b6c99a25
  • sideBar.background#e8efe3
  • sideBar.border#00000015
  • sideBar.foreground#26302b
  • sideBarSectionHeader.background#e8efe380
  • sideBarSectionHeader.foreground#26302b
  • sideBarTitle.foreground#7f9f76
  • statusBar.background#f3f7f2
  • statusBar.border#00000015
  • statusBar.foreground#26302b
  • statusBar.noFolderBackground#f3f7f2
  • tab.activeBackground#f3f7f2
  • tab.activeBorderTop#7f9f76
  • tab.activeForeground#26302b
  • tab.border#00000015
  • tab.inactiveBackground#f3f7f260
  • tab.inactiveForeground#26302b80
  • terminal.ansiBlack#26302b
  • terminal.ansiBlue#b6c99a
  • terminal.ansiCyan#6f9fb2
  • terminal.ansiGreen#7f9f76
  • terminal.ansiMagenta#7a8178
  • terminal.ansiRed#7a8178
  • terminal.ansiWhite#26302b
  • terminal.ansiYellow#6f9fb2
  • terminal.background#f3f7f2
  • terminal.foreground#26302b
  • titleBar.activeBackground#f3f7f2
  • titleBar.activeForeground#26302b
  • titleBar.border#00000015
  • titleBar.inactiveBackground#f3f7f2
  • titleBar.inactiveForeground#26302b60
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#b6c99aitalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#b6c99abold
storage.type, storage.modifier#b6c99aitalic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#7f9f76
string, punctuation.definition.string, string.template, meta.template.expression#6f9fb2
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#7a8178
variable, variable.other.readwrite, variable.other.object#26302b
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#26302b
variable.parameter, meta.parameter#26302bdditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#26302b80
keyword.operator#26302b
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#6f9fb2bold
entity.other.inherited-class#7f9f76
entity.name.tag, punctuation.definition.tag#b6c99a
entity.other.attribute-name#7f9f76
meta.diff, meta.diff.header#b6c99a
markup.deleted#7a8178
markup.inserted#7f9f76
markup.changed#6f9fb2
markup.heading, markup.heading.setext, punctuation.definition.heading#7f9f76bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#6f9fb2
string.other.link.title, string.other.link.description#7f9f76
markup.underline.link#b6c99aunderline
punctuation.definition.list#b6c99a
markup.quote, punctuation.definition.quote#b6c99aitalic
Morphous Theme by Ameyanagi - VS Code Theme