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#f5f7f2
  • activityBar.border#00000015
  • activityBar.foreground#4f7d58
  • activityBar.inactiveForeground#1f2c2a60
  • activityBarBadge.background#4f7d58
  • activityBarBadge.foreground#f5f7f2
  • button.background#4f7d58
  • button.foreground#f5f7f2
  • button.hoverBackground#4f7d58dd
  • editor.background#f5f7f2
  • editor.foreground#1f2c2a
  • editor.inactiveSelectionBackground#fffaf02580
  • editor.lineHighlightBackground#dfece750
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#fffaf025
  • editorCursor.foreground#4f7d58
  • editorGroupHeader.tabsBackground#dfece7aa
  • editorLineNumber.activeForeground#4f7d58
  • editorLineNumber.foreground#fffaf080
  • focusBorder#4f7d58
  • foreground#1f2c2a
  • input.background#dfece7
  • input.border#00000015
  • input.foreground#1f2c2a
  • input.placeholderForeground#1f2c2a60
  • list.activeSelectionBackground#4f7d5830
  • list.activeSelectionForeground#1f2c2a
  • list.highlightForeground#4f7d58
  • list.hoverBackground#dfece740
  • list.hoverForeground#1f2c2a
  • list.inactiveSelectionBackground#4f7d5815
  • list.inactiveSelectionForeground#1f2c2a
  • selection.background#fffaf025
  • sideBar.background#dfece7
  • sideBar.border#00000015
  • sideBar.foreground#1f2c2a
  • sideBarSectionHeader.background#dfece780
  • sideBarSectionHeader.foreground#1f2c2a
  • sideBarTitle.foreground#4f7d58
  • statusBar.background#f5f7f2
  • statusBar.border#00000015
  • statusBar.foreground#1f2c2a
  • statusBar.noFolderBackground#f5f7f2
  • tab.activeBackground#f5f7f2
  • tab.activeBorderTop#4f7d58
  • tab.activeForeground#1f2c2a
  • tab.border#00000015
  • tab.inactiveBackground#f5f7f260
  • tab.inactiveForeground#1f2c2a80
  • terminal.ansiBlack#1f2c2a
  • terminal.ansiBlue#fffaf0
  • terminal.ansiCyan#d9ad3b
  • terminal.ansiGreen#4f7d58
  • terminal.ansiMagenta#5f9a92
  • terminal.ansiRed#5f9a92
  • terminal.ansiWhite#1f2c2a
  • terminal.ansiYellow#d9ad3b
  • terminal.background#f5f7f2
  • terminal.foreground#1f2c2a
  • titleBar.activeBackground#f5f7f2
  • titleBar.activeForeground#1f2c2a
  • titleBar.border#00000015
  • titleBar.inactiveBackground#f5f7f2
  • titleBar.inactiveForeground#1f2c2a60
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#fffaf0italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#fffaf0bold
storage.type, storage.modifier#fffaf0italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#4f7d58
string, punctuation.definition.string, string.template, meta.template.expression#d9ad3b
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#5f9a92
variable, variable.other.readwrite, variable.other.object#1f2c2a
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#1f2c2a
variable.parameter, meta.parameter#1f2c2additalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#1f2c2a80
keyword.operator#1f2c2a
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#d9ad3bbold
entity.other.inherited-class#4f7d58
entity.name.tag, punctuation.definition.tag#fffaf0
entity.other.attribute-name#4f7d58
meta.diff, meta.diff.header#fffaf0
markup.deleted#5f9a92
markup.inserted#4f7d58
markup.changed#d9ad3b
markup.heading, markup.heading.setext, punctuation.definition.heading#4f7d58bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#d9ad3b
string.other.link.title, string.other.link.description#4f7d58
markup.underline.link#fffaf0underline
punctuation.definition.list#fffaf0
markup.quote, punctuation.definition.quote#fffaf0italic
Morphous Theme by Ameyanagi - VS Code Theme