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#363C3F
  • activityBar.border#ffffff15
  • activityBar.foreground#67E9DE
  • activityBar.inactiveForeground#FAFBFA60
  • activityBarBadge.background#67E9DE
  • activityBarBadge.foreground#363C3F
  • button.background#67E9DE
  • button.foreground#363C3F
  • button.hoverBackground#67E9DEdd
  • editor.background#363C3F
  • editor.foreground#FAFBFA
  • editor.inactiveSelectionBackground#79ECD13580
  • editor.lineHighlightBackground#12151740
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#79ECD135
  • editorCursor.foreground#67E9DE
  • editorGroupHeader.tabsBackground#363C3Fdd
  • editorLineNumber.activeForeground#67E9DE
  • editorLineNumber.foreground#D5D9DC80
  • focusBorder#67E9DE
  • foreground#FAFBFA
  • input.background#121517
  • input.border#ffffff15
  • input.foreground#FAFBFA
  • input.placeholderForeground#FAFBFA60
  • list.activeSelectionBackground#67E9DE30
  • list.activeSelectionForeground#FAFBFA
  • list.highlightForeground#67E9DE
  • list.hoverBackground#12151740
  • list.hoverForeground#FAFBFA
  • list.inactiveSelectionBackground#67E9DE15
  • list.inactiveSelectionForeground#FAFBFA
  • selection.background#79ECD135
  • sideBar.background#121517
  • sideBar.border#ffffff15
  • sideBar.foreground#FAFBFA
  • sideBarSectionHeader.background#363C3F80
  • sideBarSectionHeader.foreground#FAFBFA
  • sideBarTitle.foreground#67E9DE
  • statusBar.background#363C3F
  • statusBar.border#ffffff15
  • statusBar.foreground#FAFBFA
  • statusBar.noFolderBackground#363C3F
  • tab.activeBackground#363C3F
  • tab.activeBorderTop#67E9DE
  • tab.activeForeground#FAFBFA
  • tab.border#ffffff15
  • tab.inactiveBackground#12151760
  • tab.inactiveForeground#FAFBFA80
  • terminal.ansiBlack#363C3F
  • terminal.ansiBlue#79ECD1
  • terminal.ansiCyan#55E7BE
  • terminal.ansiGreen#67E9DE
  • terminal.ansiMagenta#F183A4
  • terminal.ansiRed#F183A4
  • terminal.ansiWhite#FAFBFA
  • terminal.ansiYellow#55E7BE
  • terminal.background#363C3F
  • terminal.foreground#FAFBFA
  • titleBar.activeBackground#363C3F
  • titleBar.activeForeground#FAFBFA
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#363C3F
  • titleBar.inactiveForeground#FAFBFA60
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#D5D9DCitalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#79ECD1bold
storage.type, storage.modifier#79ECD1italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#67E9DE
string, punctuation.definition.string, string.template, meta.template.expression#55E7BE
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#F183A4
variable, variable.other.readwrite, variable.other.object#FAFBFA
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#FAFBFA
variable.parameter, meta.parameter#FAFBFAdditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#FAFBFA80
keyword.operator#FAFBFA
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#55E7BEbold
entity.other.inherited-class#67E9DE
entity.name.tag, punctuation.definition.tag#79ECD1
entity.other.attribute-name#67E9DE
meta.diff, meta.diff.header#D5D9DC
markup.deleted#F183A4
markup.inserted#67E9DE
markup.changed#55E7BE
markup.heading, markup.heading.setext, punctuation.definition.heading#67E9DEbold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#55E7BE
string.other.link.title, string.other.link.description#67E9DE
markup.underline.link#D5D9DCunderline
punctuation.definition.list#79ECD1
markup.quote, punctuation.definition.quote#D5D9DCitalic