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#060809
  • activityBar.border#ffffff15
  • activityBar.foreground#6797E9
  • activityBar.inactiveForeground#F6FAFB60
  • activityBarBadge.background#6797E9
  • activityBarBadge.foreground#060809
  • button.background#6797E9
  • button.foreground#060809
  • button.hoverBackground#6797E9dd
  • editor.background#060809
  • editor.foreground#F6FAFB
  • editor.inactiveSelectionBackground#79ECCF3580
  • editor.lineHighlightBackground#0A090C40
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#79ECCF35
  • editorCursor.foreground#6797E9
  • editorGroupHeader.tabsBackground#060809dd
  • editorLineNumber.activeForeground#6797E9
  • editorLineNumber.foreground#6C7A7C80
  • focusBorder#6797E9
  • foreground#F6FAFB
  • input.background#0A090C
  • input.border#ffffff15
  • input.foreground#F6FAFB
  • input.placeholderForeground#F6FAFB60
  • list.activeSelectionBackground#6797E930
  • list.activeSelectionForeground#F6FAFB
  • list.highlightForeground#6797E9
  • list.hoverBackground#0A090C40
  • list.hoverForeground#F6FAFB
  • list.inactiveSelectionBackground#6797E915
  • list.inactiveSelectionForeground#F6FAFB
  • selection.background#79ECCF35
  • sideBar.background#0A090C
  • sideBar.border#ffffff15
  • sideBar.foreground#F6FAFB
  • sideBarSectionHeader.background#06080980
  • sideBarSectionHeader.foreground#F6FAFB
  • sideBarTitle.foreground#6797E9
  • statusBar.background#060809
  • statusBar.border#ffffff15
  • statusBar.foreground#F6FAFB
  • statusBar.noFolderBackground#060809
  • tab.activeBackground#060809
  • tab.activeBorderTop#6797E9
  • tab.activeForeground#F6FAFB
  • tab.border#ffffff15
  • tab.inactiveBackground#0A090C60
  • tab.inactiveForeground#F6FAFB80
  • terminal.ansiBlack#060809
  • terminal.ansiBlue#79ECCF
  • terminal.ansiCyan#55C7E7
  • terminal.ansiGreen#6797E9
  • terminal.ansiMagenta#83D6F1
  • terminal.ansiRed#83D6F1
  • terminal.ansiWhite#F6FAFB
  • terminal.ansiYellow#55C7E7
  • terminal.background#060809
  • terminal.foreground#F6FAFB
  • titleBar.activeBackground#060809
  • titleBar.activeForeground#F6FAFB
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#060809
  • titleBar.inactiveForeground#F6FAFB60
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#6C7A7Citalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#79ECCFbold
storage.type, storage.modifier#79ECCFitalic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#6797E9
string, punctuation.definition.string, string.template, meta.template.expression#55C7E7
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#83D6F1
variable, variable.other.readwrite, variable.other.object#F6FAFB
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#F6FAFB
variable.parameter, meta.parameter#F6FAFBdditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#F6FAFB80
keyword.operator#F6FAFB
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#55C7E7bold
entity.other.inherited-class#6797E9
entity.name.tag, punctuation.definition.tag#79ECCF
entity.other.attribute-name#6797E9
meta.diff, meta.diff.header#6C7A7C
markup.deleted#83D6F1
markup.inserted#6797E9
markup.changed#55C7E7
markup.heading, markup.heading.setext, punctuation.definition.heading#6797E9bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#55C7E7
string.other.link.title, string.other.link.description#6797E9
markup.underline.link#6C7A7Cunderline
punctuation.definition.list#79ECCF
markup.quote, punctuation.definition.quote#6C7A7Citalic