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#283A2F
  • activityBar.border#ffffff15
  • activityBar.foreground#6B8E2E
  • activityBar.inactiveForeground#F7F7F560
  • activityBarBadge.background#6B8E2E
  • activityBarBadge.foreground#283A2F
  • button.background#6B8E2E
  • button.foreground#283A2F
  • button.hoverBackground#6B8E2Edd
  • editor.background#283A2F
  • editor.foreground#F7F7F5
  • editor.inactiveSelectionBackground#E9E7E43580
  • editor.lineHighlightBackground#1A1A1A40
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#E9E7E435
  • editorCursor.foreground#6B8E2E
  • editorGroupHeader.tabsBackground#283A2Fdd
  • editorLineNumber.activeForeground#6B8E2E
  • editorLineNumber.foreground#B7C1B180
  • focusBorder#6B8E2E
  • foreground#F7F7F5
  • input.background#1A1A1A
  • input.border#ffffff15
  • input.foreground#F7F7F5
  • input.placeholderForeground#F7F7F560
  • list.activeSelectionBackground#6B8E2E30
  • list.activeSelectionForeground#F7F7F5
  • list.highlightForeground#6B8E2E
  • list.hoverBackground#1A1A1A40
  • list.hoverForeground#F7F7F5
  • list.inactiveSelectionBackground#6B8E2E15
  • list.inactiveSelectionForeground#F7F7F5
  • selection.background#E9E7E435
  • sideBar.background#1A1A1A
  • sideBar.border#ffffff15
  • sideBar.foreground#F7F7F5
  • sideBarSectionHeader.background#283A2F80
  • sideBarSectionHeader.foreground#F7F7F5
  • sideBarTitle.foreground#6B8E2E
  • statusBar.background#283A2F
  • statusBar.border#ffffff15
  • statusBar.foreground#F7F7F5
  • statusBar.noFolderBackground#283A2F
  • tab.activeBackground#283A2F
  • tab.activeBorderTop#6B8E2E
  • tab.activeForeground#F7F7F5
  • tab.border#ffffff15
  • tab.inactiveBackground#1A1A1A60
  • tab.inactiveForeground#F7F7F580
  • terminal.ansiBlack#283A2F
  • terminal.ansiBlue#E9E7E4
  • terminal.ansiCyan#EBDCC6
  • terminal.ansiGreen#6B8E2E
  • terminal.ansiMagenta#4F3A2B
  • terminal.ansiRed#4F3A2B
  • terminal.ansiWhite#F7F7F5
  • terminal.ansiYellow#EBDCC6
  • terminal.background#283A2F
  • terminal.foreground#F7F7F5
  • titleBar.activeBackground#283A2F
  • titleBar.activeForeground#F7F7F5
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#283A2F
  • titleBar.inactiveForeground#F7F7F560
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#B7C1B1italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#E9E7E4bold
storage.type, storage.modifier#E9E7E4italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#6B8E2E
string, punctuation.definition.string, string.template, meta.template.expression#EBDCC6
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#4F3A2B
variable, variable.other.readwrite, variable.other.object#F7F7F5
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#F7F7F5
variable.parameter, meta.parameter#F7F7F5dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#F7F7F580
keyword.operator#F7F7F5
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#EBDCC6bold
entity.other.inherited-class#6B8E2E
entity.name.tag, punctuation.definition.tag#E9E7E4
entity.other.attribute-name#6B8E2E
meta.diff, meta.diff.header#B7C1B1
markup.deleted#4F3A2B
markup.inserted#6B8E2E
markup.changed#EBDCC6
markup.heading, markup.heading.setext, punctuation.definition.heading#6B8E2Ebold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#EBDCC6
string.other.link.title, string.other.link.description#6B8E2E
markup.underline.link#B7C1B1underline
punctuation.definition.list#E9E7E4
markup.quote, punctuation.definition.quote#B7C1B1italic
Morphous Theme by Ameyanagi - VS Code Theme