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#0b3f46
  • activityBar.border#ffffff15
  • activityBar.foreground#0e8f93
  • activityBar.inactiveForeground#f4fbfa60
  • activityBarBadge.background#0e8f93
  • activityBarBadge.foreground#0b3f46
  • button.background#0e8f93
  • button.foreground#0b3f46
  • button.hoverBackground#0e8f93dd
  • editor.background#0b3f46
  • editor.foreground#f4fbfa
  • editor.inactiveSelectionBackground#7d8a8a3580
  • editor.lineHighlightBackground#17242640
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#7d8a8a35
  • editorCursor.foreground#0e8f93
  • editorGroupHeader.tabsBackground#0b3f46dd
  • editorLineNumber.activeForeground#0e8f93
  • editorLineNumber.foreground#a9b8b780
  • focusBorder#0e8f93
  • foreground#f4fbfa
  • input.background#172426
  • input.border#ffffff15
  • input.foreground#f4fbfa
  • input.placeholderForeground#f4fbfa60
  • list.activeSelectionBackground#0e8f9330
  • list.activeSelectionForeground#f4fbfa
  • list.highlightForeground#0e8f93
  • list.hoverBackground#17242640
  • list.hoverForeground#f4fbfa
  • list.inactiveSelectionBackground#0e8f9315
  • list.inactiveSelectionForeground#f4fbfa
  • selection.background#7d8a8a35
  • sideBar.background#172426
  • sideBar.border#ffffff15
  • sideBar.foreground#f4fbfa
  • sideBarSectionHeader.background#0b3f4680
  • sideBarSectionHeader.foreground#f4fbfa
  • sideBarTitle.foreground#0e8f93
  • statusBar.background#0b3f46
  • statusBar.border#ffffff15
  • statusBar.foreground#f4fbfa
  • statusBar.noFolderBackground#0b3f46
  • tab.activeBackground#0b3f46
  • tab.activeBorderTop#0e8f93
  • tab.activeForeground#f4fbfa
  • tab.border#ffffff15
  • tab.inactiveBackground#17242660
  • tab.inactiveForeground#f4fbfa80
  • terminal.ansiBlack#0b3f46
  • terminal.ansiBlue#7d8a8a
  • terminal.ansiCyan#7bdde1
  • terminal.ansiGreen#0e8f93
  • terminal.ansiMagenta#ffffff
  • terminal.ansiRed#ffffff
  • terminal.ansiWhite#f4fbfa
  • terminal.ansiYellow#7bdde1
  • terminal.background#0b3f46
  • terminal.foreground#f4fbfa
  • titleBar.activeBackground#0b3f46
  • titleBar.activeForeground#f4fbfa
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#0b3f46
  • titleBar.inactiveForeground#f4fbfa60
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#a9b8b7italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#7d8a8abold
storage.type, storage.modifier#7d8a8aitalic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#0e8f93
string, punctuation.definition.string, string.template, meta.template.expression#7bdde1
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#ffffff
variable, variable.other.readwrite, variable.other.object#f4fbfa
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#f4fbfa
variable.parameter, meta.parameter#f4fbfadditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#f4fbfa80
keyword.operator#f4fbfa
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#7bdde1bold
entity.other.inherited-class#0e8f93
entity.name.tag, punctuation.definition.tag#7d8a8a
entity.other.attribute-name#0e8f93
meta.diff, meta.diff.header#a9b8b7
markup.deleted#ffffff
markup.inserted#0e8f93
markup.changed#7bdde1
markup.heading, markup.heading.setext, punctuation.definition.heading#0e8f93bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#7bdde1
string.other.link.title, string.other.link.description#0e8f93
markup.underline.link#a9b8b7underline
punctuation.definition.list#7d8a8a
markup.quote, punctuation.definition.quote#a9b8b7italic