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#FDFDFC
  • activityBar.border#00000015
  • activityBar.foreground#702593
  • activityBar.inactiveForeground#1A102060
  • activityBarBadge.background#702593
  • activityBarBadge.foreground#FDFDFC
  • button.background#702593
  • button.foreground#FDFDFC
  • button.hoverBackground#702593dd
  • editor.background#FDFDFC
  • editor.foreground#1A1020
  • editor.inactiveSelectionBackground#2183262580
  • editor.lineHighlightBackground#F2EBDE50
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#21832625
  • editorCursor.foreground#702593
  • editorGroupHeader.tabsBackground#F2EBDEaa
  • editorLineNumber.activeForeground#702593
  • editorLineNumber.foreground#F3F2F480
  • focusBorder#702593
  • foreground#1A1020
  • input.background#F2EBDE
  • input.border#00000015
  • input.foreground#1A1020
  • input.placeholderForeground#1A102060
  • list.activeSelectionBackground#70259330
  • list.activeSelectionForeground#1A1020
  • list.highlightForeground#702593
  • list.hoverBackground#F2EBDE40
  • list.hoverForeground#1A1020
  • list.inactiveSelectionBackground#70259315
  • list.inactiveSelectionForeground#1A1020
  • selection.background#21832625
  • sideBar.background#F2EBDE
  • sideBar.border#00000015
  • sideBar.foreground#1A1020
  • sideBarSectionHeader.background#F2EBDE80
  • sideBarSectionHeader.foreground#1A1020
  • sideBarTitle.foreground#702593
  • statusBar.background#FDFDFC
  • statusBar.border#00000015
  • statusBar.foreground#1A1020
  • statusBar.noFolderBackground#FDFDFC
  • tab.activeBackground#FDFDFC
  • tab.activeBorderTop#702593
  • tab.activeForeground#1A1020
  • tab.border#00000015
  • tab.inactiveBackground#FDFDFC60
  • tab.inactiveForeground#1A102080
  • terminal.ansiBlack#1A1020
  • terminal.ansiBlue#218326
  • terminal.ansiCyan#8729A3
  • terminal.ansiGreen#702593
  • terminal.ansiMagenta#19761E
  • terminal.ansiRed#19761E
  • terminal.ansiWhite#1A1020
  • terminal.ansiYellow#8729A3
  • terminal.background#FDFDFC
  • terminal.foreground#1A1020
  • titleBar.activeBackground#FDFDFC
  • titleBar.activeForeground#1A1020
  • titleBar.border#00000015
  • titleBar.inactiveBackground#FDFDFC
  • titleBar.inactiveForeground#1A102060
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#F3F2F4italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#218326bold
storage.type, storage.modifier#218326italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#702593
string, punctuation.definition.string, string.template, meta.template.expression#8729A3
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#19761E
variable, variable.other.readwrite, variable.other.object#1A1020
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#1A1020
variable.parameter, meta.parameter#1A1020dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#1A102080
keyword.operator#1A1020
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#8729A3bold
entity.other.inherited-class#702593
entity.name.tag, punctuation.definition.tag#218326
entity.other.attribute-name#702593
meta.diff, meta.diff.header#F3F2F4
markup.deleted#19761E
markup.inserted#702593
markup.changed#8729A3
markup.heading, markup.heading.setext, punctuation.definition.heading#702593bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#8729A3
string.other.link.title, string.other.link.description#702593
markup.underline.link#F3F2F4underline
punctuation.definition.list#218326
markup.quote, punctuation.definition.quote#F3F2F4italic
Morphous Theme by Ameyanagi - VS Code Theme