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#071225
  • activityBar.border#ffffff15
  • activityBar.foreground#0f4ca8
  • activityBar.inactiveForeground#f7f9fc60
  • activityBarBadge.background#0f4ca8
  • activityBarBadge.foreground#071225
  • button.background#0f4ca8
  • button.foreground#071225
  • button.hoverBackground#0f4ca8dd
  • editor.background#071225
  • editor.foreground#f7f9fc
  • editor.inactiveSelectionBackground#a8b2c03580
  • editor.lineHighlightBackground#10131a40
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#a8b2c035
  • editorCursor.foreground#0f4ca8
  • editorGroupHeader.tabsBackground#071225dd
  • editorLineNumber.activeForeground#0f4ca8
  • editorLineNumber.foreground#c6ced880
  • focusBorder#0f4ca8
  • foreground#f7f9fc
  • input.background#10131a
  • input.border#ffffff15
  • input.foreground#f7f9fc
  • input.placeholderForeground#f7f9fc60
  • list.activeSelectionBackground#0f4ca830
  • list.activeSelectionForeground#f7f9fc
  • list.highlightForeground#0f4ca8
  • list.hoverBackground#10131a40
  • list.hoverForeground#f7f9fc
  • list.inactiveSelectionBackground#0f4ca815
  • list.inactiveSelectionForeground#f7f9fc
  • selection.background#a8b2c035
  • sideBar.background#10131a
  • sideBar.border#ffffff15
  • sideBar.foreground#f7f9fc
  • sideBarSectionHeader.background#07122580
  • sideBarSectionHeader.foreground#f7f9fc
  • sideBarTitle.foreground#0f4ca8
  • statusBar.background#071225
  • statusBar.border#ffffff15
  • statusBar.foreground#f7f9fc
  • statusBar.noFolderBackground#071225
  • tab.activeBackground#071225
  • tab.activeBorderTop#0f4ca8
  • tab.activeForeground#f7f9fc
  • tab.border#ffffff15
  • tab.inactiveBackground#10131a60
  • tab.inactiveForeground#f7f9fc80
  • terminal.ansiBlack#071225
  • terminal.ansiBlue#a8b2c0
  • terminal.ansiCyan#66b8ff
  • terminal.ansiGreen#0f4ca8
  • terminal.ansiMagenta#4a5568
  • terminal.ansiRed#4a5568
  • terminal.ansiWhite#f7f9fc
  • terminal.ansiYellow#66b8ff
  • terminal.background#071225
  • terminal.foreground#f7f9fc
  • titleBar.activeBackground#071225
  • titleBar.activeForeground#f7f9fc
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#071225
  • titleBar.inactiveForeground#f7f9fc60
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#c6ced8italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#a8b2c0bold
storage.type, storage.modifier#a8b2c0italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#0f4ca8
string, punctuation.definition.string, string.template, meta.template.expression#66b8ff
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#4a5568
variable, variable.other.readwrite, variable.other.object#f7f9fc
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#f7f9fc
variable.parameter, meta.parameter#f7f9fcdditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#f7f9fc80
keyword.operator#f7f9fc
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#66b8ffbold
entity.other.inherited-class#0f4ca8
entity.name.tag, punctuation.definition.tag#a8b2c0
entity.other.attribute-name#0f4ca8
meta.diff, meta.diff.header#c6ced8
markup.deleted#4a5568
markup.inserted#0f4ca8
markup.changed#66b8ff
markup.heading, markup.heading.setext, punctuation.definition.heading#0f4ca8bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#66b8ff
string.other.link.title, string.other.link.description#0f4ca8
markup.underline.link#c6ced8underline
punctuation.definition.list#a8b2c0
markup.quote, punctuation.definition.quote#c6ced8italic