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#F3F6F8
  • activityBar.border#00000015
  • activityBar.foreground#2E6F8E
  • activityBar.inactiveForeground#2B303760
  • activityBarBadge.background#2E6F8E
  • activityBarBadge.foreground#F3F6F8
  • button.background#2E6F8E
  • button.foreground#F3F6F8
  • button.hoverBackground#2E6F8Edd
  • editor.background#F3F6F8
  • editor.foreground#2B3037
  • editor.inactiveSelectionBackground#D6DBDF2580
  • editor.lineHighlightBackground#FFFFFF50
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#D6DBDF25
  • editorCursor.foreground#2E6F8E
  • editorGroupHeader.tabsBackground#FFFFFFaa
  • editorLineNumber.activeForeground#2E6F8E
  • editorLineNumber.foreground#E6EEF280
  • focusBorder#2E6F8E
  • foreground#2B3037
  • input.background#FFFFFF
  • input.border#00000015
  • input.foreground#2B3037
  • input.placeholderForeground#2B303760
  • list.activeSelectionBackground#2E6F8E30
  • list.activeSelectionForeground#2B3037
  • list.highlightForeground#2E6F8E
  • list.hoverBackground#FFFFFF40
  • list.hoverForeground#2B3037
  • list.inactiveSelectionBackground#2E6F8E15
  • list.inactiveSelectionForeground#2B3037
  • selection.background#D6DBDF25
  • sideBar.background#FFFFFF
  • sideBar.border#00000015
  • sideBar.foreground#2B3037
  • sideBarSectionHeader.background#FFFFFF80
  • sideBarSectionHeader.foreground#2B3037
  • sideBarTitle.foreground#2E6F8E
  • statusBar.background#F3F6F8
  • statusBar.border#00000015
  • statusBar.foreground#2B3037
  • statusBar.noFolderBackground#F3F6F8
  • tab.activeBackground#F3F6F8
  • tab.activeBorderTop#2E6F8E
  • tab.activeForeground#2B3037
  • tab.border#00000015
  • tab.inactiveBackground#F3F6F860
  • tab.inactiveForeground#2B303780
  • terminal.ansiBlack#2B3037
  • terminal.ansiBlue#D6DBDF
  • terminal.ansiCyan#98A2AD
  • terminal.ansiGreen#2E6F8E
  • terminal.ansiMagenta#B7792E
  • terminal.ansiRed#B7792E
  • terminal.ansiWhite#2B3037
  • terminal.ansiYellow#98A2AD
  • terminal.background#F3F6F8
  • terminal.foreground#2B3037
  • titleBar.activeBackground#F3F6F8
  • titleBar.activeForeground#2B3037
  • titleBar.border#00000015
  • titleBar.inactiveBackground#F3F6F8
  • titleBar.inactiveForeground#2B303760
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#E6EEF2italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#D6DBDFbold
storage.type, storage.modifier#D6DBDFitalic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#2E6F8E
string, punctuation.definition.string, string.template, meta.template.expression#98A2AD
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#B7792E
variable, variable.other.readwrite, variable.other.object#2B3037
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#2B3037
variable.parameter, meta.parameter#2B3037dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#2B303780
keyword.operator#2B3037
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#98A2ADbold
entity.other.inherited-class#2E6F8E
entity.name.tag, punctuation.definition.tag#D6DBDF
entity.other.attribute-name#2E6F8E
meta.diff, meta.diff.header#E6EEF2
markup.deleted#B7792E
markup.inserted#2E6F8E
markup.changed#98A2AD
markup.heading, markup.heading.setext, punctuation.definition.heading#2E6F8Ebold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#98A2AD
string.other.link.title, string.other.link.description#2E6F8E
markup.underline.link#E6EEF2underline
punctuation.definition.list#D6DBDF
markup.quote, punctuation.definition.quote#E6EEF2italic
Morphous Theme by Ameyanagi - VS Code Theme