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#F3F7FA
  • activityBar.border#00000015
  • activityBar.foreground#1E6FAE
  • activityBar.inactiveForeground#0D1B2A60
  • activityBarBadge.background#1E6FAE
  • activityBarBadge.foreground#F3F7FA
  • button.background#1E6FAE
  • button.foreground#F3F7FA
  • button.hoverBackground#1E6FAEdd
  • editor.background#F3F7FA
  • editor.foreground#0D1B2A
  • editor.inactiveSelectionBackground#F4E8D62580
  • editor.lineHighlightBackground#FFFFFF50
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#F4E8D625
  • editorCursor.foreground#1E6FAE
  • editorGroupHeader.tabsBackground#FFFFFFaa
  • editorLineNumber.activeForeground#1E6FAE
  • editorLineNumber.foreground#6C728080
  • focusBorder#1E6FAE
  • foreground#0D1B2A
  • input.background#FFFFFF
  • input.border#00000015
  • input.foreground#0D1B2A
  • input.placeholderForeground#0D1B2A60
  • list.activeSelectionBackground#1E6FAE30
  • list.activeSelectionForeground#0D1B2A
  • list.highlightForeground#1E6FAE
  • list.hoverBackground#FFFFFF40
  • list.hoverForeground#0D1B2A
  • list.inactiveSelectionBackground#1E6FAE15
  • list.inactiveSelectionForeground#0D1B2A
  • selection.background#F4E8D625
  • sideBar.background#FFFFFF
  • sideBar.border#00000015
  • sideBar.foreground#0D1B2A
  • sideBarSectionHeader.background#FFFFFF80
  • sideBarSectionHeader.foreground#0D1B2A
  • sideBarTitle.foreground#1E6FAE
  • statusBar.background#F3F7FA
  • statusBar.border#00000015
  • statusBar.foreground#0D1B2A
  • statusBar.noFolderBackground#F3F7FA
  • tab.activeBackground#F3F7FA
  • tab.activeBorderTop#1E6FAE
  • tab.activeForeground#0D1B2A
  • tab.border#00000015
  • tab.inactiveBackground#F3F7FA60
  • tab.inactiveForeground#0D1B2A80
  • terminal.ansiBlack#0D1B2A
  • terminal.ansiBlue#F4E8D6
  • terminal.ansiCyan#00B3E6
  • terminal.ansiGreen#1E6FAE
  • terminal.ansiMagenta#6C7280
  • terminal.ansiRed#6C7280
  • terminal.ansiWhite#0D1B2A
  • terminal.ansiYellow#00B3E6
  • terminal.background#F3F7FA
  • terminal.foreground#0D1B2A
  • titleBar.activeBackground#F3F7FA
  • titleBar.activeForeground#0D1B2A
  • titleBar.border#00000015
  • titleBar.inactiveBackground#F3F7FA
  • titleBar.inactiveForeground#0D1B2A60
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#6C7280italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#F4E8D6bold
storage.type, storage.modifier#F4E8D6italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#1E6FAE
string, punctuation.definition.string, string.template, meta.template.expression#00B3E6
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#6C7280
variable, variable.other.readwrite, variable.other.object#0D1B2A
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#0D1B2A
variable.parameter, meta.parameter#0D1B2Additalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#0D1B2A80
keyword.operator#0D1B2A
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#00B3E6bold
entity.other.inherited-class#1E6FAE
entity.name.tag, punctuation.definition.tag#F4E8D6
entity.other.attribute-name#1E6FAE
meta.diff, meta.diff.header#6C7280
markup.deleted#6C7280
markup.inserted#1E6FAE
markup.changed#00B3E6
markup.heading, markup.heading.setext, punctuation.definition.heading#1E6FAEbold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#00B3E6
string.other.link.title, string.other.link.description#1E6FAE
markup.underline.link#6C7280underline
punctuation.definition.list#F4E8D6
markup.quote, punctuation.definition.quote#6C7280italic