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

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#0e1b2b
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#0e1b2b
variable.parameter, meta.parameter#0e1b2bdditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#0e1b2b80
keyword.operator#0e1b2b
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