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#E5EBE8
  • activityBar.border#00000015
  • activityBar.foreground#258D93
  • activityBar.inactiveForeground#0a2a3660
  • activityBarBadge.background#258D93
  • activityBarBadge.foreground#E5EBE8
  • button.background#258D93
  • button.foreground#E5EBE8
  • button.hoverBackground#258D93dd
  • editor.background#E5EBE8
  • editor.foreground#0a2a36
  • editor.inactiveSelectionBackground#834E212580
  • editor.lineHighlightBackground#F7F8F650
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#834E2125
  • editorCursor.foreground#258D93
  • editorGroupHeader.tabsBackground#F7F8F6aa
  • editorLineNumber.activeForeground#258D93
  • editorLineNumber.foreground#8c817380
  • focusBorder#258D93
  • foreground#0a2a36
  • input.background#F7F8F6
  • input.border#00000015
  • input.foreground#0a2a36
  • input.placeholderForeground#0a2a3660
  • list.activeSelectionBackground#258D9330
  • list.activeSelectionForeground#0a2a36
  • list.highlightForeground#258D93
  • list.hoverBackground#F7F8F640
  • list.hoverForeground#0a2a36
  • list.inactiveSelectionBackground#258D9315
  • list.inactiveSelectionForeground#0a2a36
  • selection.background#834E2125
  • sideBar.background#F7F8F6
  • sideBar.border#00000015
  • sideBar.foreground#0a2a36
  • sideBarSectionHeader.background#F7F8F680
  • sideBarSectionHeader.foreground#0a2a36
  • sideBarTitle.foreground#258D93
  • statusBar.background#E5EBE8
  • statusBar.border#00000015
  • statusBar.foreground#0a2a36
  • statusBar.noFolderBackground#E5EBE8
  • tab.activeBackground#E5EBE8
  • tab.activeBorderTop#258D93
  • tab.activeForeground#0a2a36
  • tab.border#00000015
  • tab.inactiveBackground#E5EBE860
  • tab.inactiveForeground#0a2a3680
  • terminal.ansiBlack#0a2a36
  • terminal.ansiBlue#834E21
  • terminal.ansiCyan#37A329
  • terminal.ansiGreen#258D93
  • terminal.ansiMagenta#497619
  • terminal.ansiRed#497619
  • terminal.ansiWhite#0a2a36
  • terminal.ansiYellow#37A329
  • terminal.background#E5EBE8
  • terminal.foreground#0a2a36
  • titleBar.activeBackground#E5EBE8
  • titleBar.activeForeground#0a2a36
  • titleBar.border#00000015
  • titleBar.inactiveBackground#E5EBE8
  • titleBar.inactiveForeground#0a2a3660
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#8c8173italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#834E21bold
storage.type, storage.modifier#834E21italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#258D93
string, punctuation.definition.string, string.template, meta.template.expression#37A329
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#497619
variable, variable.other.readwrite, variable.other.object#0a2a36
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#0a2a36
variable.parameter, meta.parameter#0a2a36dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#0a2a3680
keyword.operator#0a2a36
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#37A329bold
entity.other.inherited-class#258D93
entity.name.tag, punctuation.definition.tag#834E21
entity.other.attribute-name#258D93
meta.diff, meta.diff.header#8c8173
markup.deleted#497619
markup.inserted#258D93
markup.changed#37A329
markup.heading, markup.heading.setext, punctuation.definition.heading#258D93bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#37A329
string.other.link.title, string.other.link.description#258D93
markup.underline.link#8c8173underline
punctuation.definition.list#834E21
markup.quote, punctuation.definition.quote#8c8173italic
Morphous Theme by Ameyanagi - VS Code Theme