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#232823
  • activityBar.border#ffffff15
  • activityBar.foreground#5E7F63
  • activityBar.inactiveForeground#FBFCFA60
  • activityBarBadge.background#5E7F63
  • activityBarBadge.foreground#232823
  • button.background#5E7F63
  • button.foreground#232823
  • button.hoverBackground#5E7F63dd
  • editor.background#232823
  • editor.foreground#FBFCFA
  • editor.inactiveSelectionBackground#A7B6A83580
  • editor.lineHighlightBackground#23282340
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#A7B6A835
  • editorCursor.foreground#5E7F63
  • editorGroupHeader.tabsBackground#232823dd
  • editorLineNumber.activeForeground#5E7F63
  • editorLineNumber.foreground#E7ECE780
  • focusBorder#5E7F63
  • foreground#FBFCFA
  • input.background#232823
  • input.border#ffffff15
  • input.foreground#FBFCFA
  • input.placeholderForeground#FBFCFA60
  • list.activeSelectionBackground#5E7F6330
  • list.activeSelectionForeground#FBFCFA
  • list.highlightForeground#5E7F63
  • list.hoverBackground#23282340
  • list.hoverForeground#FBFCFA
  • list.inactiveSelectionBackground#5E7F6315
  • list.inactiveSelectionForeground#FBFCFA
  • selection.background#A7B6A835
  • sideBar.background#232823
  • sideBar.border#ffffff15
  • sideBar.foreground#FBFCFA
  • sideBarSectionHeader.background#23282380
  • sideBarSectionHeader.foreground#FBFCFA
  • sideBarTitle.foreground#5E7F63
  • statusBar.background#232823
  • statusBar.border#ffffff15
  • statusBar.foreground#FBFCFA
  • statusBar.noFolderBackground#232823
  • tab.activeBackground#232823
  • tab.activeBorderTop#5E7F63
  • tab.activeForeground#FBFCFA
  • tab.border#ffffff15
  • tab.inactiveBackground#23282360
  • tab.inactiveForeground#FBFCFA80
  • terminal.ansiBlack#232823
  • terminal.ansiBlue#A7B6A8
  • terminal.ansiCyan#7FAF78
  • terminal.ansiGreen#5E7F63
  • terminal.ansiMagenta#C81D2E
  • terminal.ansiRed#C81D2E
  • terminal.ansiWhite#FBFCFA
  • terminal.ansiYellow#7FAF78
  • terminal.background#232823
  • terminal.foreground#FBFCFA
  • titleBar.activeBackground#232823
  • titleBar.activeForeground#FBFCFA
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#232823
  • titleBar.inactiveForeground#FBFCFA60
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#E7ECE7italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#A7B6A8bold
storage.type, storage.modifier#A7B6A8italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#5E7F63
string, punctuation.definition.string, string.template, meta.template.expression#7FAF78
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#C81D2E
variable, variable.other.readwrite, variable.other.object#FBFCFA
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#FBFCFA
variable.parameter, meta.parameter#FBFCFAdditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#FBFCFA80
keyword.operator#FBFCFA
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#7FAF78bold
entity.other.inherited-class#5E7F63
entity.name.tag, punctuation.definition.tag#A7B6A8
entity.other.attribute-name#5E7F63
meta.diff, meta.diff.header#E7ECE7
markup.deleted#C81D2E
markup.inserted#5E7F63
markup.changed#7FAF78
markup.heading, markup.heading.setext, punctuation.definition.heading#5E7F63bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#7FAF78
string.other.link.title, string.other.link.description#5E7F63
markup.underline.link#E7ECE7underline
punctuation.definition.list#A7B6A8
markup.quote, punctuation.definition.quote#E7ECE7italic
Morphous Theme by Ameyanagi - VS Code Theme