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#313A34
  • activityBar.border#ffffff15
  • activityBar.foreground#67E9A8
  • activityBar.inactiveForeground#F5F6F460
  • activityBarBadge.background#67E9A8
  • activityBarBadge.foreground#313A34
  • button.background#67E9A8
  • button.foreground#313A34
  • button.hoverBackground#67E9A8dd
  • editor.background#313A34
  • editor.foreground#F5F6F4
  • editor.inactiveSelectionBackground#79C0EC3580
  • editor.lineHighlightBackground#19313940
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#79C0EC35
  • editorCursor.foreground#67E9A8
  • editorGroupHeader.tabsBackground#313A34dd
  • editorLineNumber.activeForeground#67E9A8
  • editorLineNumber.foreground#E7ECEF80
  • focusBorder#67E9A8
  • foreground#F5F6F4
  • input.background#193139
  • input.border#ffffff15
  • input.foreground#F5F6F4
  • input.placeholderForeground#F5F6F460
  • list.activeSelectionBackground#67E9A830
  • list.activeSelectionForeground#F5F6F4
  • list.highlightForeground#67E9A8
  • list.hoverBackground#19313940
  • list.hoverForeground#F5F6F4
  • list.inactiveSelectionBackground#67E9A815
  • list.inactiveSelectionForeground#F5F6F4
  • selection.background#79C0EC35
  • sideBar.background#193139
  • sideBar.border#ffffff15
  • sideBar.foreground#F5F6F4
  • sideBarSectionHeader.background#313A3480
  • sideBarSectionHeader.foreground#F5F6F4
  • sideBarTitle.foreground#67E9A8
  • statusBar.background#313A34
  • statusBar.border#ffffff15
  • statusBar.foreground#F5F6F4
  • statusBar.noFolderBackground#313A34
  • tab.activeBackground#313A34
  • tab.activeBorderTop#67E9A8
  • tab.activeForeground#F5F6F4
  • tab.border#ffffff15
  • tab.inactiveBackground#19313960
  • tab.inactiveForeground#F5F6F480
  • terminal.ansiBlack#313A34
  • terminal.ansiBlue#79C0EC
  • terminal.ansiCyan#E79C55
  • terminal.ansiGreen#67E9A8
  • terminal.ansiMagenta#83F1AA
  • terminal.ansiRed#83F1AA
  • terminal.ansiWhite#F5F6F4
  • terminal.ansiYellow#E79C55
  • terminal.background#313A34
  • terminal.foreground#F5F6F4
  • titleBar.activeBackground#313A34
  • titleBar.activeForeground#F5F6F4
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#313A34
  • titleBar.inactiveForeground#F5F6F460
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#E7ECEFitalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#79C0ECbold
storage.type, storage.modifier#79C0ECitalic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#67E9A8
string, punctuation.definition.string, string.template, meta.template.expression#E79C55
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#83F1AA
variable, variable.other.readwrite, variable.other.object#F5F6F4
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#F5F6F4
variable.parameter, meta.parameter#F5F6F4dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#F5F6F480
keyword.operator#F5F6F4
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#E79C55bold
entity.other.inherited-class#67E9A8
entity.name.tag, punctuation.definition.tag#79C0EC
entity.other.attribute-name#67E9A8
meta.diff, meta.diff.header#E7ECEF
markup.deleted#83F1AA
markup.inserted#67E9A8
markup.changed#E79C55
markup.heading, markup.heading.setext, punctuation.definition.heading#67E9A8bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#E79C55
string.other.link.title, string.other.link.description#67E9A8
markup.underline.link#E7ECEFunderline
punctuation.definition.list#79C0EC
markup.quote, punctuation.definition.quote#E7ECEFitalic