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#FAFCFF
  • activityBar.border#00000015
  • activityBar.foreground#259393
  • activityBar.inactiveForeground#080F1460
  • activityBarBadge.background#259393
  • activityBarBadge.foreground#FAFCFF
  • button.background#259393
  • button.foreground#FAFCFF
  • button.hoverBackground#259393dd
  • editor.background#FAFCFF
  • editor.foreground#080F14
  • editor.inactiveSelectionBackground#216F832580
  • editor.lineHighlightBackground#F4F7FA50
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#216F8325
  • editorCursor.foreground#259393
  • editorGroupHeader.tabsBackground#F4F7FAaa
  • editorLineNumber.activeForeground#259393
  • editorLineNumber.foreground#D8E7F180
  • focusBorder#259393
  • foreground#080F14
  • input.background#F4F7FA
  • input.border#00000015
  • input.foreground#080F14
  • input.placeholderForeground#080F1460
  • list.activeSelectionBackground#25939330
  • list.activeSelectionForeground#080F14
  • list.highlightForeground#259393
  • list.hoverBackground#F4F7FA40
  • list.hoverForeground#080F14
  • list.inactiveSelectionBackground#25939315
  • list.inactiveSelectionForeground#080F14
  • selection.background#216F8325
  • sideBar.background#F4F7FA
  • sideBar.border#00000015
  • sideBar.foreground#080F14
  • sideBarSectionHeader.background#F4F7FA80
  • sideBarSectionHeader.foreground#080F14
  • sideBarTitle.foreground#259393
  • statusBar.background#FAFCFF
  • statusBar.border#00000015
  • statusBar.foreground#080F14
  • statusBar.noFolderBackground#FAFCFF
  • tab.activeBackground#FAFCFF
  • tab.activeBorderTop#259393
  • tab.activeForeground#080F14
  • tab.border#00000015
  • tab.inactiveBackground#FAFCFF60
  • tab.inactiveForeground#080F1480
  • terminal.ansiBlack#080F14
  • terminal.ansiBlue#216F83
  • terminal.ansiCyan#3B29A3
  • terminal.ansiGreen#259393
  • terminal.ansiMagenta#192A76
  • terminal.ansiRed#192A76
  • terminal.ansiWhite#080F14
  • terminal.ansiYellow#3B29A3
  • terminal.background#FAFCFF
  • terminal.foreground#080F14
  • titleBar.activeBackground#FAFCFF
  • titleBar.activeForeground#080F14
  • titleBar.border#00000015
  • titleBar.inactiveBackground#FAFCFF
  • titleBar.inactiveForeground#080F1460
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#D8E7F1italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#216F83bold
storage.type, storage.modifier#216F83italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#259393
string, punctuation.definition.string, string.template, meta.template.expression#3B29A3
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#192A76
variable, variable.other.readwrite, variable.other.object#080F14
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#080F14
variable.parameter, meta.parameter#080F14dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#080F1480
keyword.operator#080F14
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#3B29A3bold
entity.other.inherited-class#259393
entity.name.tag, punctuation.definition.tag#216F83
entity.other.attribute-name#259393
meta.diff, meta.diff.header#D8E7F1
markup.deleted#192A76
markup.inserted#259393
markup.changed#3B29A3
markup.heading, markup.heading.setext, punctuation.definition.heading#259393bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#3B29A3
string.other.link.title, string.other.link.description#259393
markup.underline.link#D8E7F1underline
punctuation.definition.list#216F83
markup.quote, punctuation.definition.quote#D8E7F1italic
Morphous Theme by Ameyanagi - VS Code Theme