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#0f2233
  • activityBar.border#ffffff15
  • activityBar.foreground#4aa3df
  • activityBar.inactiveForeground#f8fbff60
  • activityBarBadge.background#4aa3df
  • activityBarBadge.foreground#0f2233
  • button.background#4aa3df
  • button.foreground#0f2233
  • button.hoverBackground#4aa3dfdd
  • editor.background#0f2233
  • editor.foreground#f8fbff
  • editor.inactiveSelectionBackground#9fb4c73580
  • editor.lineHighlightBackground#1f2b3640
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#9fb4c735
  • editorCursor.foreground#4aa3df
  • editorGroupHeader.tabsBackground#0f2233dd
  • editorLineNumber.activeForeground#4aa3df
  • editorLineNumber.foreground#b9c8d480
  • focusBorder#4aa3df
  • foreground#f8fbff
  • input.background#1f2b36
  • input.border#ffffff15
  • input.foreground#f8fbff
  • input.placeholderForeground#f8fbff60
  • list.activeSelectionBackground#4aa3df30
  • list.activeSelectionForeground#f8fbff
  • list.highlightForeground#4aa3df
  • list.hoverBackground#1f2b3640
  • list.hoverForeground#f8fbff
  • list.inactiveSelectionBackground#4aa3df15
  • list.inactiveSelectionForeground#f8fbff
  • selection.background#9fb4c735
  • sideBar.background#1f2b36
  • sideBar.border#ffffff15
  • sideBar.foreground#f8fbff
  • sideBarSectionHeader.background#0f223380
  • sideBarSectionHeader.foreground#f8fbff
  • sideBarTitle.foreground#4aa3df
  • statusBar.background#0f2233
  • statusBar.border#ffffff15
  • statusBar.foreground#f8fbff
  • statusBar.noFolderBackground#0f2233
  • tab.activeBackground#0f2233
  • tab.activeBorderTop#4aa3df
  • tab.activeForeground#f8fbff
  • tab.border#ffffff15
  • tab.inactiveBackground#1f2b3660
  • tab.inactiveForeground#f8fbff80
  • terminal.ansiBlack#0f2233
  • terminal.ansiBlue#9fb4c7
  • terminal.ansiCyan#8de2f0
  • terminal.ansiGreen#4aa3df
  • terminal.ansiMagenta#7c8bc9
  • terminal.ansiRed#7c8bc9
  • terminal.ansiWhite#f8fbff
  • terminal.ansiYellow#8de2f0
  • terminal.background#0f2233
  • terminal.foreground#f8fbff
  • titleBar.activeBackground#0f2233
  • titleBar.activeForeground#f8fbff
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#0f2233
  • titleBar.inactiveForeground#f8fbff60
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#b9c8d4italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#9fb4c7bold
storage.type, storage.modifier#9fb4c7italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#4aa3df
string, punctuation.definition.string, string.template, meta.template.expression#8de2f0
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#7c8bc9
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#8de2f0bold
entity.other.inherited-class#4aa3df
entity.name.tag, punctuation.definition.tag#9fb4c7
entity.other.attribute-name#4aa3df
meta.diff, meta.diff.header#b9c8d4
markup.deleted#7c8bc9
markup.inserted#4aa3df
markup.changed#8de2f0
markup.heading, markup.heading.setext, punctuation.definition.heading#4aa3dfbold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#8de2f0
string.other.link.title, string.other.link.description#4aa3df
markup.underline.link#b9c8d4underline
punctuation.definition.list#9fb4c7
markup.quote, punctuation.definition.quote#b9c8d4italic