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#4A148C
  • activityBar.border#ffffff15
  • activityBar.foreground#E91E8C
  • activityBar.inactiveForeground#FDF7FC60
  • activityBarBadge.background#E91E8C
  • activityBarBadge.foreground#4A148C
  • button.background#E91E8C
  • button.foreground#4A148C
  • button.hoverBackground#E91E8Cdd
  • editor.background#4A148C
  • editor.foreground#FDF7FC
  • editor.inactiveSelectionBackground#7B1FA23580
  • editor.lineHighlightBackground#1C132440
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#7B1FA235
  • editorCursor.foreground#E91E8C
  • editorGroupHeader.tabsBackground#4A148Cdd
  • editorLineNumber.activeForeground#E91E8C
  • editorLineNumber.foreground#F3E5F580
  • focusBorder#E91E8C
  • foreground#FDF7FC
  • input.background#1C1324
  • input.border#ffffff15
  • input.foreground#FDF7FC
  • input.placeholderForeground#FDF7FC60
  • list.activeSelectionBackground#E91E8C30
  • list.activeSelectionForeground#FDF7FC
  • list.highlightForeground#E91E8C
  • list.hoverBackground#1C132440
  • list.hoverForeground#FDF7FC
  • list.inactiveSelectionBackground#E91E8C15
  • list.inactiveSelectionForeground#FDF7FC
  • selection.background#7B1FA235
  • sideBar.background#1C1324
  • sideBar.border#ffffff15
  • sideBar.foreground#FDF7FC
  • sideBarSectionHeader.background#4A148C80
  • sideBarSectionHeader.foreground#FDF7FC
  • sideBarTitle.foreground#E91E8C
  • statusBar.background#4A148C
  • statusBar.border#ffffff15
  • statusBar.foreground#FDF7FC
  • statusBar.noFolderBackground#4A148C
  • tab.activeBackground#4A148C
  • tab.activeBorderTop#E91E8C
  • tab.activeForeground#FDF7FC
  • tab.border#ffffff15
  • tab.inactiveBackground#1C132460
  • tab.inactiveForeground#FDF7FC80
  • terminal.ansiBlack#4A148C
  • terminal.ansiBlue#7B1FA2
  • terminal.ansiCyan#FF4FA3
  • terminal.ansiGreen#E91E8C
  • terminal.ansiMagenta#4CAF50
  • terminal.ansiRed#4CAF50
  • terminal.ansiWhite#FDF7FC
  • terminal.ansiYellow#FF4FA3
  • terminal.background#4A148C
  • terminal.foreground#FDF7FC
  • titleBar.activeBackground#4A148C
  • titleBar.activeForeground#FDF7FC
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#4A148C
  • titleBar.inactiveForeground#FDF7FC60
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#F3E5F5italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#7B1FA2bold
storage.type, storage.modifier#7B1FA2italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#E91E8C
string, punctuation.definition.string, string.template, meta.template.expression#FF4FA3
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#4CAF50
variable, variable.other.readwrite, variable.other.object#FDF7FC
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#FDF7FC
variable.parameter, meta.parameter#FDF7FCdditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#FDF7FC80
keyword.operator#FDF7FC
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#FF4FA3bold
entity.other.inherited-class#E91E8C
entity.name.tag, punctuation.definition.tag#7B1FA2
entity.other.attribute-name#E91E8C
meta.diff, meta.diff.header#F3E5F5
markup.deleted#4CAF50
markup.inserted#E91E8C
markup.changed#FF4FA3
markup.heading, markup.heading.setext, punctuation.definition.heading#E91E8Cbold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#FF4FA3
string.other.link.title, string.other.link.description#E91E8C
markup.underline.link#F3E5F5underline
punctuation.definition.list#7B1FA2
markup.quote, punctuation.definition.quote#F3E5F5italic