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#11181d
  • activityBar.border#ffffff15
  • activityBar.foreground#4f9ab8
  • activityBar.inactiveForeground#f8faf860
  • activityBarBadge.background#4f9ab8
  • activityBarBadge.foreground#11181d
  • button.background#4f9ab8
  • button.foreground#11181d
  • button.hoverBackground#4f9ab8dd
  • editor.background#11181d
  • editor.foreground#f8faf8
  • editor.inactiveSelectionBackground#d7dee23580
  • editor.lineHighlightBackground#1f242840
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#d7dee235
  • editorCursor.foreground#4f9ab8
  • editorGroupHeader.tabsBackground#11181ddd
  • editorLineNumber.activeForeground#4f9ab8
  • editorLineNumber.foreground#b9c4ca80
  • focusBorder#4f9ab8
  • foreground#f8faf8
  • input.background#1f2428
  • input.border#ffffff15
  • input.foreground#f8faf8
  • input.placeholderForeground#f8faf860
  • list.activeSelectionBackground#4f9ab830
  • list.activeSelectionForeground#f8faf8
  • list.highlightForeground#4f9ab8
  • list.hoverBackground#1f242840
  • list.hoverForeground#f8faf8
  • list.inactiveSelectionBackground#4f9ab815
  • list.inactiveSelectionForeground#f8faf8
  • selection.background#d7dee235
  • sideBar.background#1f2428
  • sideBar.border#ffffff15
  • sideBar.foreground#f8faf8
  • sideBarSectionHeader.background#11181d80
  • sideBarSectionHeader.foreground#f8faf8
  • sideBarTitle.foreground#4f9ab8
  • statusBar.background#11181d
  • statusBar.border#ffffff15
  • statusBar.foreground#f8faf8
  • statusBar.noFolderBackground#11181d
  • tab.activeBackground#11181d
  • tab.activeBorderTop#4f9ab8
  • tab.activeForeground#f8faf8
  • tab.border#ffffff15
  • tab.inactiveBackground#1f242860
  • tab.inactiveForeground#f8faf880
  • terminal.ansiBlack#11181d
  • terminal.ansiBlue#d7dee2
  • terminal.ansiCyan#a9dbe8
  • terminal.ansiGreen#4f9ab8
  • terminal.ansiMagenta#697987
  • terminal.ansiRed#697987
  • terminal.ansiWhite#f8faf8
  • terminal.ansiYellow#a9dbe8
  • terminal.background#11181d
  • terminal.foreground#f8faf8
  • titleBar.activeBackground#11181d
  • titleBar.activeForeground#f8faf8
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#11181d
  • titleBar.inactiveForeground#f8faf860
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#b9c4caitalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#d7dee2bold
storage.type, storage.modifier#d7dee2italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#4f9ab8
string, punctuation.definition.string, string.template, meta.template.expression#a9dbe8
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#697987
variable, variable.other.readwrite, variable.other.object#f8faf8
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#f8faf8
variable.parameter, meta.parameter#f8faf8dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#f8faf880
keyword.operator#f8faf8
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#a9dbe8bold
entity.other.inherited-class#4f9ab8
entity.name.tag, punctuation.definition.tag#d7dee2
entity.other.attribute-name#4f9ab8
meta.diff, meta.diff.header#b9c4ca
markup.deleted#697987
markup.inserted#4f9ab8
markup.changed#a9dbe8
markup.heading, markup.heading.setext, punctuation.definition.heading#4f9ab8bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#a9dbe8
string.other.link.title, string.other.link.description#4f9ab8
markup.underline.link#b9c4caunderline
punctuation.definition.list#d7dee2
markup.quote, punctuation.definition.quote#b9c4caitalic