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#0f2a44
  • activityBar.border#ffffff15
  • activityBar.foreground#2e78e6
  • activityBar.inactiveForeground#f8fbff60
  • activityBarBadge.background#2e78e6
  • activityBarBadge.foreground#0f2a44
  • button.background#2e78e6
  • button.foreground#0f2a44
  • button.hoverBackground#2e78e6dd
  • editor.background#0f2a44
  • editor.foreground#f8fbff
  • editor.inactiveSelectionBackground#8a94a33580
  • editor.lineHighlightBackground#11161d40
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#8a94a335
  • editorCursor.foreground#2e78e6
  • editorGroupHeader.tabsBackground#0f2a44dd
  • editorLineNumber.activeForeground#2e78e6
  • editorLineNumber.foreground#d7dde580
  • focusBorder#2e78e6
  • foreground#f8fbff
  • input.background#11161d
  • input.border#ffffff15
  • input.foreground#f8fbff
  • input.placeholderForeground#f8fbff60
  • list.activeSelectionBackground#2e78e630
  • list.activeSelectionForeground#f8fbff
  • list.highlightForeground#2e78e6
  • list.hoverBackground#11161d40
  • list.hoverForeground#f8fbff
  • list.inactiveSelectionBackground#2e78e615
  • list.inactiveSelectionForeground#f8fbff
  • selection.background#8a94a335
  • sideBar.background#11161d
  • sideBar.border#ffffff15
  • sideBar.foreground#f8fbff
  • sideBarSectionHeader.background#0f2a4480
  • sideBarSectionHeader.foreground#f8fbff
  • sideBarTitle.foreground#2e78e6
  • statusBar.background#0f2a44
  • statusBar.border#ffffff15
  • statusBar.foreground#f8fbff
  • statusBar.noFolderBackground#0f2a44
  • tab.activeBackground#0f2a44
  • tab.activeBorderTop#2e78e6
  • tab.activeForeground#f8fbff
  • tab.border#ffffff15
  • tab.inactiveBackground#11161d60
  • tab.inactiveForeground#f8fbff80
  • terminal.ansiBlack#0f2a44
  • terminal.ansiBlue#8a94a3
  • terminal.ansiCyan#c8f6ff
  • terminal.ansiGreen#2e78e6
  • terminal.ansiMagenta#64a7ff
  • terminal.ansiRed#64a7ff
  • terminal.ansiWhite#f8fbff
  • terminal.ansiYellow#c8f6ff
  • terminal.background#0f2a44
  • terminal.foreground#f8fbff
  • titleBar.activeBackground#0f2a44
  • titleBar.activeForeground#f8fbff
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#0f2a44
  • titleBar.inactiveForeground#f8fbff60
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#d7dde5italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#8a94a3bold
storage.type, storage.modifier#8a94a3italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#2e78e6
string, punctuation.definition.string, string.template, meta.template.expression#c8f6ff
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#64a7ff
variable, variable.other.readwrite, variable.other.object#f8fbff
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#f8fbff
variable.parameter, meta.parameter#f8fbffdditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#f8fbff80
keyword.operator#f8fbff
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#c8f6ffbold
entity.other.inherited-class#2e78e6
entity.name.tag, punctuation.definition.tag#8a94a3
entity.other.attribute-name#2e78e6
meta.diff, meta.diff.header#d7dde5
markup.deleted#64a7ff
markup.inserted#2e78e6
markup.changed#c8f6ff
markup.heading, markup.heading.setext, punctuation.definition.heading#2e78e6bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#c8f6ff
string.other.link.title, string.other.link.description#2e78e6
markup.underline.link#d7dde5underline
punctuation.definition.list#8a94a3
markup.quote, punctuation.definition.quote#d7dde5italic