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#1A1F23
  • activityBar.border#ffffff15
  • activityBar.foreground#9AA2A6
  • activityBar.inactiveForeground#ECE9E160
  • activityBarBadge.background#9AA2A6
  • activityBarBadge.foreground#1A1F23
  • button.background#9AA2A6
  • button.foreground#1A1F23
  • button.hoverBackground#9AA2A6dd
  • editor.background#1A1F23
  • editor.foreground#ECE9E1
  • editor.inactiveSelectionBackground#ECE9E13580
  • editor.lineHighlightBackground#2E3A4040
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#ECE9E135
  • editorCursor.foreground#9AA2A6
  • editorGroupHeader.tabsBackground#1A1F23dd
  • editorLineNumber.activeForeground#9AA2A6
  • editorLineNumber.foreground#ECE9E180
  • focusBorder#9AA2A6
  • foreground#ECE9E1
  • input.background#2E3A40
  • input.border#ffffff15
  • input.foreground#ECE9E1
  • input.placeholderForeground#ECE9E160
  • list.activeSelectionBackground#9AA2A630
  • list.activeSelectionForeground#ECE9E1
  • list.highlightForeground#9AA2A6
  • list.hoverBackground#2E3A4040
  • list.hoverForeground#ECE9E1
  • list.inactiveSelectionBackground#9AA2A615
  • list.inactiveSelectionForeground#ECE9E1
  • selection.background#ECE9E135
  • sideBar.background#2E3A40
  • sideBar.border#ffffff15
  • sideBar.foreground#ECE9E1
  • sideBarSectionHeader.background#1A1F2380
  • sideBarSectionHeader.foreground#ECE9E1
  • sideBarTitle.foreground#9AA2A6
  • statusBar.background#1A1F23
  • statusBar.border#ffffff15
  • statusBar.foreground#ECE9E1
  • statusBar.noFolderBackground#1A1F23
  • tab.activeBackground#1A1F23
  • tab.activeBorderTop#9AA2A6
  • tab.activeForeground#ECE9E1
  • tab.border#ffffff15
  • tab.inactiveBackground#2E3A4060
  • tab.inactiveForeground#ECE9E180
  • terminal.ansiBlack#1A1F23
  • terminal.ansiBlue#ECE9E1
  • terminal.ansiCyan#69D1CF
  • terminal.ansiGreen#9AA2A6
  • terminal.ansiMagenta#2CA7A0
  • terminal.ansiRed#2CA7A0
  • terminal.ansiWhite#ECE9E1
  • terminal.ansiYellow#69D1CF
  • terminal.background#1A1F23
  • terminal.foreground#ECE9E1
  • titleBar.activeBackground#1A1F23
  • titleBar.activeForeground#ECE9E1
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#1A1F23
  • titleBar.inactiveForeground#ECE9E160
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#ECE9E1italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#ECE9E1bold
storage.type, storage.modifier#ECE9E1italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#9AA2A6
string, punctuation.definition.string, string.template, meta.template.expression#69D1CF
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#2CA7A0
variable, variable.other.readwrite, variable.other.object#ECE9E1
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#ECE9E1
variable.parameter, meta.parameter#ECE9E1dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#ECE9E180
keyword.operator#ECE9E1
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#69D1CFbold
entity.other.inherited-class#9AA2A6
entity.name.tag, punctuation.definition.tag#ECE9E1
entity.other.attribute-name#9AA2A6
meta.diff, meta.diff.header#ECE9E1
markup.deleted#2CA7A0
markup.inserted#9AA2A6
markup.changed#69D1CF
markup.heading, markup.heading.setext, punctuation.definition.heading#9AA2A6bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#69D1CF
string.other.link.title, string.other.link.description#9AA2A6
markup.underline.link#ECE9E1underline
punctuation.definition.list#ECE9E1
markup.quote, punctuation.definition.quote#ECE9E1italic