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#18364d
  • activityBar.border#ffffff15
  • activityBar.foreground#4f7fa6
  • activityBar.inactiveForeground#fbfcfa60
  • activityBarBadge.background#4f7fa6
  • activityBarBadge.foreground#18364d
  • button.background#4f7fa6
  • button.foreground#18364d
  • button.hoverBackground#4f7fa6dd
  • editor.background#18364d
  • editor.foreground#fbfcfa
  • editor.inactiveSelectionBackground#5c8f8b3580
  • editor.lineHighlightBackground#0e1b2b40
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#5c8f8b35
  • editorCursor.foreground#4f7fa6
  • editorGroupHeader.tabsBackground#18364ddd
  • editorLineNumber.activeForeground#4f7fa6
  • editorLineNumber.foreground#e6eef280
  • focusBorder#4f7fa6
  • foreground#fbfcfa
  • input.background#0e1b2b
  • input.border#ffffff15
  • input.foreground#fbfcfa
  • input.placeholderForeground#fbfcfa60
  • list.activeSelectionBackground#4f7fa630
  • list.activeSelectionForeground#fbfcfa
  • list.highlightForeground#4f7fa6
  • list.hoverBackground#0e1b2b40
  • list.hoverForeground#fbfcfa
  • list.inactiveSelectionBackground#4f7fa615
  • list.inactiveSelectionForeground#fbfcfa
  • selection.background#5c8f8b35
  • sideBar.background#0e1b2b
  • sideBar.border#ffffff15
  • sideBar.foreground#fbfcfa
  • sideBarSectionHeader.background#18364d80
  • sideBarSectionHeader.foreground#fbfcfa
  • sideBarTitle.foreground#4f7fa6
  • statusBar.background#18364d
  • statusBar.border#ffffff15
  • statusBar.foreground#fbfcfa
  • statusBar.noFolderBackground#18364d
  • tab.activeBackground#18364d
  • tab.activeBorderTop#4f7fa6
  • tab.activeForeground#fbfcfa
  • tab.border#ffffff15
  • tab.inactiveBackground#0e1b2b60
  • tab.inactiveForeground#fbfcfa80
  • terminal.ansiBlack#18364d
  • terminal.ansiBlue#5c8f8b
  • terminal.ansiCyan#8a8f4c
  • terminal.ansiGreen#4f7fa6
  • terminal.ansiMagenta#c8954a
  • terminal.ansiRed#c8954a
  • terminal.ansiWhite#fbfcfa
  • terminal.ansiYellow#8a8f4c
  • terminal.background#18364d
  • terminal.foreground#fbfcfa
  • titleBar.activeBackground#18364d
  • titleBar.activeForeground#fbfcfa
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#18364d
  • titleBar.inactiveForeground#fbfcfa60
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#e6eef2italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#5c8f8bbold
storage.type, storage.modifier#5c8f8bitalic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#4f7fa6
string, punctuation.definition.string, string.template, meta.template.expression#8a8f4c
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#c8954a
variable, variable.other.readwrite, variable.other.object#fbfcfa
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#fbfcfa
variable.parameter, meta.parameter#fbfcfadditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#fbfcfa80
keyword.operator#fbfcfa
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#8a8f4cbold
entity.other.inherited-class#4f7fa6
entity.name.tag, punctuation.definition.tag#5c8f8b
entity.other.attribute-name#4f7fa6
meta.diff, meta.diff.header#e6eef2
markup.deleted#c8954a
markup.inserted#4f7fa6
markup.changed#8a8f4c
markup.heading, markup.heading.setext, punctuation.definition.heading#4f7fa6bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#8a8f4c
string.other.link.title, string.other.link.description#4f7fa6
markup.underline.link#e6eef2underline
punctuation.definition.list#5c8f8b
markup.quote, punctuation.definition.quote#e6eef2italic