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#080D0D
  • activityBar.border#ffffff15
  • activityBar.foreground#67E9C9
  • activityBar.inactiveForeground#F7F8FA60
  • activityBarBadge.background#67E9C9
  • activityBarBadge.foreground#080D0D
  • button.background#67E9C9
  • button.foreground#080D0D
  • button.hoverBackground#67E9C9dd
  • editor.background#080D0D
  • editor.foreground#F7F8FA
  • editor.inactiveSelectionBackground#ECC2793580
  • editor.lineHighlightBackground#1B232740
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#ECC27935
  • editorCursor.foreground#67E9C9
  • editorGroupHeader.tabsBackground#080D0Ddd
  • editorLineNumber.activeForeground#67E9C9
  • editorLineNumber.foreground#E8EAED80
  • focusBorder#67E9C9
  • foreground#F7F8FA
  • input.background#1B2327
  • input.border#ffffff15
  • input.foreground#F7F8FA
  • input.placeholderForeground#F7F8FA60
  • list.activeSelectionBackground#67E9C930
  • list.activeSelectionForeground#F7F8FA
  • list.highlightForeground#67E9C9
  • list.hoverBackground#1B232740
  • list.hoverForeground#F7F8FA
  • list.inactiveSelectionBackground#67E9C915
  • list.inactiveSelectionForeground#F7F8FA
  • selection.background#ECC27935
  • sideBar.background#1B2327
  • sideBar.border#ffffff15
  • sideBar.foreground#F7F8FA
  • sideBarSectionHeader.background#080D0D80
  • sideBarSectionHeader.foreground#F7F8FA
  • sideBarTitle.foreground#67E9C9
  • statusBar.background#080D0D
  • statusBar.border#ffffff15
  • statusBar.foreground#F7F8FA
  • statusBar.noFolderBackground#080D0D
  • tab.activeBackground#080D0D
  • tab.activeBorderTop#67E9C9
  • tab.activeForeground#F7F8FA
  • tab.border#ffffff15
  • tab.inactiveBackground#1B232760
  • tab.inactiveForeground#F7F8FA80
  • terminal.ansiBlack#080D0D
  • terminal.ansiBlue#ECC279
  • terminal.ansiCyan#E7B155
  • terminal.ansiGreen#67E9C9
  • terminal.ansiMagenta#F18983
  • terminal.ansiRed#F18983
  • terminal.ansiWhite#F7F8FA
  • terminal.ansiYellow#E7B155
  • terminal.background#080D0D
  • terminal.foreground#F7F8FA
  • titleBar.activeBackground#080D0D
  • titleBar.activeForeground#F7F8FA
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#080D0D
  • titleBar.inactiveForeground#F7F8FA60
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#E8EAEDitalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#ECC279bold
storage.type, storage.modifier#ECC279italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#67E9C9
string, punctuation.definition.string, string.template, meta.template.expression#E7B155
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#F18983
variable, variable.other.readwrite, variable.other.object#F7F8FA
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#F7F8FA
variable.parameter, meta.parameter#F7F8FAdditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#F7F8FA80
keyword.operator#F7F8FA
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#E7B155bold
entity.other.inherited-class#67E9C9
entity.name.tag, punctuation.definition.tag#ECC279
entity.other.attribute-name#67E9C9
meta.diff, meta.diff.header#E8EAED
markup.deleted#F18983
markup.inserted#67E9C9
markup.changed#E7B155
markup.heading, markup.heading.setext, punctuation.definition.heading#67E9C9bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#E7B155
string.other.link.title, string.other.link.description#67E9C9
markup.underline.link#E8EAEDunderline
punctuation.definition.list#ECC279
markup.quote, punctuation.definition.quote#E8EAEDitalic
Morphous Theme by Ameyanagi - VS Code Theme