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#121417
  • activityBar.border#ffffff15
  • activityBar.foreground#8b1e1e
  • activityBar.inactiveForeground#fffefe60
  • activityBarBadge.background#8b1e1e
  • activityBarBadge.foreground#121417
  • button.background#8b1e1e
  • button.foreground#121417
  • button.hoverBackground#8b1e1edd
  • editor.background#121417
  • editor.foreground#fffefe
  • editor.inactiveSelectionBackground#6b727a3580
  • editor.lineHighlightBackground#2b2f3340
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#6b727a35
  • editorCursor.foreground#8b1e1e
  • editorGroupHeader.tabsBackground#121417dd
  • editorLineNumber.activeForeground#8b1e1e
  • editorLineNumber.foreground#f4f5f680
  • focusBorder#8b1e1e
  • foreground#fffefe
  • input.background#2b2f33
  • input.border#ffffff15
  • input.foreground#fffefe
  • input.placeholderForeground#fffefe60
  • list.activeSelectionBackground#8b1e1e30
  • list.activeSelectionForeground#fffefe
  • list.highlightForeground#8b1e1e
  • list.hoverBackground#2b2f3340
  • list.hoverForeground#fffefe
  • list.inactiveSelectionBackground#8b1e1e15
  • list.inactiveSelectionForeground#fffefe
  • selection.background#6b727a35
  • sideBar.background#2b2f33
  • sideBar.border#ffffff15
  • sideBar.foreground#fffefe
  • sideBarSectionHeader.background#12141780
  • sideBarSectionHeader.foreground#fffefe
  • sideBarTitle.foreground#8b1e1e
  • statusBar.background#121417
  • statusBar.border#ffffff15
  • statusBar.foreground#fffefe
  • statusBar.noFolderBackground#121417
  • tab.activeBackground#121417
  • tab.activeBorderTop#8b1e1e
  • tab.activeForeground#fffefe
  • tab.border#ffffff15
  • tab.inactiveBackground#2b2f3360
  • tab.inactiveForeground#fffefe80
  • terminal.ansiBlack#121417
  • terminal.ansiBlue#6b727a
  • terminal.ansiCyan#d6dade
  • terminal.ansiGreen#8b1e1e
  • terminal.ansiMagenta#c47f2a
  • terminal.ansiRed#c47f2a
  • terminal.ansiWhite#fffefe
  • terminal.ansiYellow#d6dade
  • terminal.background#121417
  • terminal.foreground#fffefe
  • titleBar.activeBackground#121417
  • titleBar.activeForeground#fffefe
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#121417
  • titleBar.inactiveForeground#fffefe60
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#f4f5f6italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#6b727abold
storage.type, storage.modifier#6b727aitalic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#8b1e1e
string, punctuation.definition.string, string.template, meta.template.expression#d6dade
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#c47f2a
variable, variable.other.readwrite, variable.other.object#fffefe
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#fffefe
variable.parameter, meta.parameter#fffefedditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#fffefe80
keyword.operator#fffefe
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#d6dadebold
entity.other.inherited-class#8b1e1e
entity.name.tag, punctuation.definition.tag#6b727a
entity.other.attribute-name#8b1e1e
meta.diff, meta.diff.header#f4f5f6
markup.deleted#c47f2a
markup.inserted#8b1e1e
markup.changed#d6dade
markup.heading, markup.heading.setext, punctuation.definition.heading#8b1e1ebold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#d6dade
string.other.link.title, string.other.link.description#8b1e1e
markup.underline.link#f4f5f6underline
punctuation.definition.list#6b727a
markup.quote, punctuation.definition.quote#f4f5f6italic
Morphous Theme by Ameyanagi - VS Code Theme