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#05070a
  • activityBar.border#ffffff15
  • activityBar.foreground#3b82b8
  • activityBar.inactiveForeground#f2f4f560
  • activityBarBadge.background#3b82b8
  • activityBarBadge.foreground#05070a
  • button.background#3b82b8
  • button.foreground#05070a
  • button.hoverBackground#3b82b8dd
  • editor.background#05070a
  • editor.foreground#f2f4f5
  • editor.inactiveSelectionBackground#6f78823580
  • editor.lineHighlightBackground#11131640
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#6f788235
  • editorCursor.foreground#3b82b8
  • editorGroupHeader.tabsBackground#05070add
  • editorLineNumber.activeForeground#3b82b8
  • editorLineNumber.foreground#9aa0a580
  • focusBorder#3b82b8
  • foreground#f2f4f5
  • input.background#111316
  • input.border#ffffff15
  • input.foreground#f2f4f5
  • input.placeholderForeground#f2f4f560
  • list.activeSelectionBackground#3b82b830
  • list.activeSelectionForeground#f2f4f5
  • list.highlightForeground#3b82b8
  • list.hoverBackground#11131640
  • list.hoverForeground#f2f4f5
  • list.inactiveSelectionBackground#3b82b815
  • list.inactiveSelectionForeground#f2f4f5
  • selection.background#6f788235
  • sideBar.background#111316
  • sideBar.border#ffffff15
  • sideBar.foreground#f2f4f5
  • sideBarSectionHeader.background#05070a80
  • sideBarSectionHeader.foreground#f2f4f5
  • sideBarTitle.foreground#3b82b8
  • statusBar.background#05070a
  • statusBar.border#ffffff15
  • statusBar.foreground#f2f4f5
  • statusBar.noFolderBackground#05070a
  • tab.activeBackground#05070a
  • tab.activeBorderTop#3b82b8
  • tab.activeForeground#f2f4f5
  • tab.border#ffffff15
  • tab.inactiveBackground#11131660
  • tab.inactiveForeground#f2f4f580
  • terminal.ansiBlack#05070a
  • terminal.ansiBlue#6f7882
  • terminal.ansiCyan#9bb8c8
  • terminal.ansiGreen#3b82b8
  • terminal.ansiMagenta#b24a3a
  • terminal.ansiRed#b24a3a
  • terminal.ansiWhite#f2f4f5
  • terminal.ansiYellow#9bb8c8
  • terminal.background#05070a
  • terminal.foreground#f2f4f5
  • titleBar.activeBackground#05070a
  • titleBar.activeForeground#f2f4f5
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#05070a
  • titleBar.inactiveForeground#f2f4f560
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#9aa0a5italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#6f7882bold
storage.type, storage.modifier#6f7882italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#3b82b8
string, punctuation.definition.string, string.template, meta.template.expression#9bb8c8
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#b24a3a
variable, variable.other.readwrite, variable.other.object#f2f4f5
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#f2f4f5
variable.parameter, meta.parameter#f2f4f5dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#f2f4f580
keyword.operator#f2f4f5
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#9bb8c8bold
entity.other.inherited-class#3b82b8
entity.name.tag, punctuation.definition.tag#6f7882
entity.other.attribute-name#3b82b8
meta.diff, meta.diff.header#9aa0a5
markup.deleted#b24a3a
markup.inserted#3b82b8
markup.changed#9bb8c8
markup.heading, markup.heading.setext, punctuation.definition.heading#3b82b8bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#9bb8c8
string.other.link.title, string.other.link.description#3b82b8
markup.underline.link#9aa0a5underline
punctuation.definition.list#6f7882
markup.quote, punctuation.definition.quote#9aa0a5italic