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#FAFBFF
  • activityBar.border#00000015
  • activityBar.foreground#254B93
  • activityBar.inactiveForeground#0b102060
  • activityBarBadge.background#254B93
  • activityBarBadge.foreground#FAFBFF
  • button.background#254B93
  • button.foreground#FAFBFF
  • button.hoverBackground#254B93dd
  • editor.background#FAFBFF
  • editor.foreground#0b1020
  • editor.inactiveSelectionBackground#8349212580
  • editor.lineHighlightBackground#F3F9FC50
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#83492125
  • editorCursor.foreground#254B93
  • editorGroupHeader.tabsBackground#F3F9FCaa
  • editorLineNumber.activeForeground#254B93
  • editorLineNumber.foreground#aab4c280
  • focusBorder#254B93
  • foreground#0b1020
  • input.background#F3F9FC
  • input.border#00000015
  • input.foreground#0b1020
  • input.placeholderForeground#0b102060
  • list.activeSelectionBackground#254B9330
  • list.activeSelectionForeground#0b1020
  • list.highlightForeground#254B93
  • list.hoverBackground#F3F9FC40
  • list.hoverForeground#0b1020
  • list.inactiveSelectionBackground#254B9315
  • list.inactiveSelectionForeground#0b1020
  • selection.background#83492125
  • sideBar.background#F3F9FC
  • sideBar.border#00000015
  • sideBar.foreground#0b1020
  • sideBarSectionHeader.background#F3F9FC80
  • sideBarSectionHeader.foreground#0b1020
  • sideBarTitle.foreground#254B93
  • statusBar.background#FAFBFF
  • statusBar.border#00000015
  • statusBar.foreground#0b1020
  • statusBar.noFolderBackground#FAFBFF
  • tab.activeBackground#FAFBFF
  • tab.activeBorderTop#254B93
  • tab.activeForeground#0b1020
  • tab.border#00000015
  • tab.inactiveBackground#FAFBFF60
  • tab.inactiveForeground#0b102080
  • terminal.ansiBlack#0b1020
  • terminal.ansiBlue#834921
  • terminal.ansiCyan#4929A3
  • terminal.ansiGreen#254B93
  • terminal.ansiMagenta#761919
  • terminal.ansiRed#761919
  • terminal.ansiWhite#0b1020
  • terminal.ansiYellow#4929A3
  • terminal.background#FAFBFF
  • terminal.foreground#0b1020
  • titleBar.activeBackground#FAFBFF
  • titleBar.activeForeground#0b1020
  • titleBar.border#00000015
  • titleBar.inactiveBackground#FAFBFF
  • titleBar.inactiveForeground#0b102060
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#aab4c2italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#834921bold
storage.type, storage.modifier#834921italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#254B93
string, punctuation.definition.string, string.template, meta.template.expression#4929A3
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#761919
variable, variable.other.readwrite, variable.other.object#0b1020
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#0b1020
variable.parameter, meta.parameter#0b1020dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#0b102080
keyword.operator#0b1020
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#4929A3bold
entity.other.inherited-class#254B93
entity.name.tag, punctuation.definition.tag#834921
entity.other.attribute-name#254B93
meta.diff, meta.diff.header#aab4c2
markup.deleted#761919
markup.inserted#254B93
markup.changed#4929A3
markup.heading, markup.heading.setext, punctuation.definition.heading#254B93bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#4929A3
string.other.link.title, string.other.link.description#254B93
markup.underline.link#aab4c2underline
punctuation.definition.list#834921
markup.quote, punctuation.definition.quote#aab4c2italic
Morphous Theme by Ameyanagi - VS Code Theme