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#ffffff
  • activityBar.border#ffffff15
  • activityBar.foreground#1a1d21
  • activityBar.inactiveForeground#f2f4f660
  • activityBarBadge.background#1a1d21
  • activityBarBadge.foreground#ffffff
  • button.background#1a1d21
  • button.foreground#ffffff
  • button.hoverBackground#1a1d21dd
  • editor.background#ffffff
  • editor.foreground#f2f4f6
  • editor.inactiveSelectionBackground#3a3f463580
  • editor.lineHighlightBackground#0d0f1240
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#3a3f4635
  • editorCursor.foreground#1a1d21
  • editorGroupHeader.tabsBackground#ffffffdd
  • editorLineNumber.activeForeground#1a1d21
  • editorLineNumber.foreground#6b717880
  • focusBorder#1a1d21
  • foreground#f2f4f6
  • input.background#0d0f12
  • input.border#ffffff15
  • input.foreground#f2f4f6
  • input.placeholderForeground#f2f4f660
  • list.activeSelectionBackground#1a1d2130
  • list.activeSelectionForeground#f2f4f6
  • list.highlightForeground#1a1d21
  • list.hoverBackground#0d0f1240
  • list.hoverForeground#f2f4f6
  • list.inactiveSelectionBackground#1a1d2115
  • list.inactiveSelectionForeground#f2f4f6
  • selection.background#3a3f4635
  • sideBar.background#0d0f12
  • sideBar.border#ffffff15
  • sideBar.foreground#f2f4f6
  • sideBarSectionHeader.background#ffffff80
  • sideBarSectionHeader.foreground#f2f4f6
  • sideBarTitle.foreground#1a1d21
  • statusBar.background#ffffff
  • statusBar.border#ffffff15
  • statusBar.foreground#f2f4f6
  • statusBar.noFolderBackground#ffffff
  • tab.activeBackground#ffffff
  • tab.activeBorderTop#1a1d21
  • tab.activeForeground#f2f4f6
  • tab.border#ffffff15
  • tab.inactiveBackground#0d0f1260
  • tab.inactiveForeground#f2f4f680
  • terminal.ansiBlack#ffffff
  • terminal.ansiBlue#3a3f46
  • terminal.ansiCyan#182633
  • terminal.ansiGreen#1a1d21
  • terminal.ansiMagenta#d97706
  • terminal.ansiRed#d97706
  • terminal.ansiWhite#f2f4f6
  • terminal.ansiYellow#182633
  • terminal.background#ffffff
  • terminal.foreground#f2f4f6
  • titleBar.activeBackground#ffffff
  • titleBar.activeForeground#f2f4f6
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#ffffff
  • titleBar.inactiveForeground#f2f4f660
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#6b7178italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#3a3f46bold
storage.type, storage.modifier#3a3f46italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#1a1d21
string, punctuation.definition.string, string.template, meta.template.expression#182633
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#d97706
variable, variable.other.readwrite, variable.other.object#f2f4f6
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#f2f4f6
variable.parameter, meta.parameter#f2f4f6dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#f2f4f680
keyword.operator#f2f4f6
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#182633bold
entity.other.inherited-class#1a1d21
entity.name.tag, punctuation.definition.tag#3a3f46
entity.other.attribute-name#1a1d21
meta.diff, meta.diff.header#6b7178
markup.deleted#d97706
markup.inserted#1a1d21
markup.changed#182633
markup.heading, markup.heading.setext, punctuation.definition.heading#1a1d21bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#182633
string.other.link.title, string.other.link.description#1a1d21
markup.underline.link#6b7178underline
punctuation.definition.list#3a3f46
markup.quote, punctuation.definition.quote#6b7178italic
Morphous Theme by Ameyanagi - VS Code Theme