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#F9FBFA
  • activityBar.border#00000015
  • activityBar.foreground#258D93
  • activityBar.inactiveForeground#D9E7E360
  • activityBarBadge.background#258D93
  • activityBarBadge.foreground#F9FBFA
  • button.background#258D93
  • button.foreground#F9FBFA
  • button.hoverBackground#258D93dd
  • editor.background#F9FBFA
  • editor.foreground#D9E7E3
  • editor.inactiveSelectionBackground#4883212580
  • editor.lineHighlightBackground#E3EDEA50
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#48832125
  • editorCursor.foreground#258D93
  • editorGroupHeader.tabsBackground#E3EDEAaa
  • editorLineNumber.activeForeground#258D93
  • editorLineNumber.foreground#0F3D3F80
  • focusBorder#258D93
  • foreground#D9E7E3
  • input.background#E3EDEA
  • input.border#00000015
  • input.foreground#D9E7E3
  • input.placeholderForeground#D9E7E360
  • list.activeSelectionBackground#258D9330
  • list.activeSelectionForeground#D9E7E3
  • list.highlightForeground#258D93
  • list.hoverBackground#E3EDEA40
  • list.hoverForeground#D9E7E3
  • list.inactiveSelectionBackground#258D9315
  • list.inactiveSelectionForeground#D9E7E3
  • selection.background#48832125
  • sideBar.background#E3EDEA
  • sideBar.border#00000015
  • sideBar.foreground#D9E7E3
  • sideBarSectionHeader.background#E3EDEA80
  • sideBarSectionHeader.foreground#D9E7E3
  • sideBarTitle.foreground#258D93
  • statusBar.background#F9FBFA
  • statusBar.border#00000015
  • statusBar.foreground#D9E7E3
  • statusBar.noFolderBackground#F9FBFA
  • tab.activeBackground#F9FBFA
  • tab.activeBorderTop#258D93
  • tab.activeForeground#D9E7E3
  • tab.border#00000015
  • tab.inactiveBackground#F9FBFA60
  • tab.inactiveForeground#D9E7E380
  • terminal.ansiBlack#D9E7E3
  • terminal.ansiBlue#488321
  • terminal.ansiCyan#29A3A3
  • terminal.ansiGreen#258D93
  • terminal.ansiMagenta#527619
  • terminal.ansiRed#527619
  • terminal.ansiWhite#D9E7E3
  • terminal.ansiYellow#29A3A3
  • terminal.background#F9FBFA
  • terminal.foreground#D9E7E3
  • titleBar.activeBackground#F9FBFA
  • titleBar.activeForeground#D9E7E3
  • titleBar.border#00000015
  • titleBar.inactiveBackground#F9FBFA
  • titleBar.inactiveForeground#D9E7E360
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#0F3D3Fitalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#488321bold
storage.type, storage.modifier#488321italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#258D93
string, punctuation.definition.string, string.template, meta.template.expression#29A3A3
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#527619
variable, variable.other.readwrite, variable.other.object#D9E7E3
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#D9E7E3
variable.parameter, meta.parameter#D9E7E3dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#D9E7E380
keyword.operator#D9E7E3
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#29A3A3bold
entity.other.inherited-class#258D93
entity.name.tag, punctuation.definition.tag#488321
entity.other.attribute-name#258D93
meta.diff, meta.diff.header#0F3D3F
markup.deleted#527619
markup.inserted#258D93
markup.changed#29A3A3
markup.heading, markup.heading.setext, punctuation.definition.heading#258D93bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#29A3A3
string.other.link.title, string.other.link.description#258D93
markup.underline.link#0F3D3Funderline
punctuation.definition.list#488321
markup.quote, punctuation.definition.quote#0F3D3Fitalic
Morphous Theme by Ameyanagi - VS Code Theme