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#040A10
  • activityBar.border#ffffff15
  • activityBar.foreground#67E9C2
  • activityBar.inactiveForeground#F3F7F460
  • activityBarBadge.background#67E9C2
  • activityBarBadge.foreground#040A10
  • button.background#67E9C2
  • button.foreground#040A10
  • button.hoverBackground#67E9C2dd
  • editor.background#040A10
  • editor.foreground#F3F7F4
  • editor.inactiveSelectionBackground#EC9C793580
  • editor.lineHighlightBackground#05100D40
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#EC9C7935
  • editorCursor.foreground#67E9C2
  • editorGroupHeader.tabsBackground#040A10dd
  • editorLineNumber.activeForeground#67E9C2
  • editorLineNumber.foreground#E3EDE680
  • focusBorder#67E9C2
  • foreground#F3F7F4
  • input.background#05100D
  • input.border#ffffff15
  • input.foreground#F3F7F4
  • input.placeholderForeground#F3F7F460
  • list.activeSelectionBackground#67E9C230
  • list.activeSelectionForeground#F3F7F4
  • list.highlightForeground#67E9C2
  • list.hoverBackground#05100D40
  • list.hoverForeground#F3F7F4
  • list.inactiveSelectionBackground#67E9C215
  • list.inactiveSelectionForeground#F3F7F4
  • selection.background#EC9C7935
  • sideBar.background#05100D
  • sideBar.border#ffffff15
  • sideBar.foreground#F3F7F4
  • sideBarSectionHeader.background#040A1080
  • sideBarSectionHeader.foreground#F3F7F4
  • sideBarTitle.foreground#67E9C2
  • statusBar.background#040A10
  • statusBar.border#ffffff15
  • statusBar.foreground#F3F7F4
  • statusBar.noFolderBackground#040A10
  • tab.activeBackground#040A10
  • tab.activeBorderTop#67E9C2
  • tab.activeForeground#F3F7F4
  • tab.border#ffffff15
  • tab.inactiveBackground#05100D60
  • tab.inactiveForeground#F3F7F480
  • terminal.ansiBlack#040A10
  • terminal.ansiBlue#EC9C79
  • terminal.ansiCyan#55A5E7
  • terminal.ansiGreen#67E9C2
  • terminal.ansiMagenta#F1AF83
  • terminal.ansiRed#F1AF83
  • terminal.ansiWhite#F3F7F4
  • terminal.ansiYellow#55A5E7
  • terminal.background#040A10
  • terminal.foreground#F3F7F4
  • titleBar.activeBackground#040A10
  • titleBar.activeForeground#F3F7F4
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#040A10
  • titleBar.inactiveForeground#F3F7F460
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#E3EDE6italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#EC9C79bold
storage.type, storage.modifier#EC9C79italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#67E9C2
string, punctuation.definition.string, string.template, meta.template.expression#55A5E7
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#F1AF83
variable, variable.other.readwrite, variable.other.object#F3F7F4
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#F3F7F4
variable.parameter, meta.parameter#F3F7F4dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#F3F7F480
keyword.operator#F3F7F4
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#55A5E7bold
entity.other.inherited-class#67E9C2
entity.name.tag, punctuation.definition.tag#EC9C79
entity.other.attribute-name#67E9C2
meta.diff, meta.diff.header#E3EDE6
markup.deleted#F1AF83
markup.inserted#67E9C2
markup.changed#55A5E7
markup.heading, markup.heading.setext, punctuation.definition.heading#67E9C2bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#55A5E7
string.other.link.title, string.other.link.description#67E9C2
markup.underline.link#E3EDE6underline
punctuation.definition.list#EC9C79
markup.quote, punctuation.definition.quote#E3EDE6italic
Morphous Theme by Ameyanagi - VS Code Theme