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#152224
  • activityBar.border#ffffff15
  • activityBar.foreground#2f80ed
  • activityBar.inactiveForeground#f8faf760
  • activityBarBadge.background#2f80ed
  • activityBarBadge.foreground#152224
  • button.background#2f80ed
  • button.foreground#152224
  • button.hoverBackground#2f80eddd
  • editor.background#152224
  • editor.foreground#f8faf7
  • editor.inactiveSelectionBackground#4f9f583580
  • editor.lineHighlightBackground#25303340
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#4f9f5835
  • editorCursor.foreground#2f80ed
  • editorGroupHeader.tabsBackground#152224dd
  • editorLineNumber.activeForeground#2f80ed
  • editorLineNumber.foreground#a7b1b280
  • focusBorder#2f80ed
  • foreground#f8faf7
  • input.background#253033
  • input.border#ffffff15
  • input.foreground#f8faf7
  • input.placeholderForeground#f8faf760
  • list.activeSelectionBackground#2f80ed30
  • list.activeSelectionForeground#f8faf7
  • list.highlightForeground#2f80ed
  • list.hoverBackground#25303340
  • list.hoverForeground#f8faf7
  • list.inactiveSelectionBackground#2f80ed15
  • list.inactiveSelectionForeground#f8faf7
  • selection.background#4f9f5835
  • sideBar.background#253033
  • sideBar.border#ffffff15
  • sideBar.foreground#f8faf7
  • sideBarSectionHeader.background#15222480
  • sideBarSectionHeader.foreground#f8faf7
  • sideBarTitle.foreground#2f80ed
  • statusBar.background#152224
  • statusBar.border#ffffff15
  • statusBar.foreground#f8faf7
  • statusBar.noFolderBackground#152224
  • tab.activeBackground#152224
  • tab.activeBorderTop#2f80ed
  • tab.activeForeground#f8faf7
  • tab.border#ffffff15
  • tab.inactiveBackground#25303360
  • tab.inactiveForeground#f8faf780
  • terminal.ansiBlack#152224
  • terminal.ansiBlue#4f9f58
  • terminal.ansiCyan#f2c94c
  • terminal.ansiGreen#2f80ed
  • terminal.ansiMagenta#eb5757
  • terminal.ansiRed#eb5757
  • terminal.ansiWhite#f8faf7
  • terminal.ansiYellow#f2c94c
  • terminal.background#152224
  • terminal.foreground#f8faf7
  • titleBar.activeBackground#152224
  • titleBar.activeForeground#f8faf7
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#152224
  • titleBar.inactiveForeground#f8faf760
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#a7b1b2italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#4f9f58bold
storage.type, storage.modifier#4f9f58italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#2f80ed
string, punctuation.definition.string, string.template, meta.template.expression#f2c94c
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#eb5757
variable, variable.other.readwrite, variable.other.object#f8faf7
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#f8faf7
variable.parameter, meta.parameter#f8faf7dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#f8faf780
keyword.operator#f8faf7
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#f2c94cbold
entity.other.inherited-class#2f80ed
entity.name.tag, punctuation.definition.tag#4f9f58
entity.other.attribute-name#2f80ed
meta.diff, meta.diff.header#a7b1b2
markup.deleted#eb5757
markup.inserted#2f80ed
markup.changed#f2c94c
markup.heading, markup.heading.setext, punctuation.definition.heading#2f80edbold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#f2c94c
string.other.link.title, string.other.link.description#2f80ed
markup.underline.link#a7b1b2underline
punctuation.definition.list#4f9f58
markup.quote, punctuation.definition.quote#a7b1b2italic