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#2E3531
  • activityBar.border#ffffff15
  • activityBar.foreground#E11074
  • activityBar.inactiveForeground#F2F4F560
  • activityBarBadge.background#E11074
  • activityBarBadge.foreground#2E3531
  • button.background#E11074
  • button.foreground#2E3531
  • button.hoverBackground#E11074dd
  • editor.background#2E3531
  • editor.foreground#F2F4F5
  • editor.inactiveSelectionBackground#17683A3580
  • editor.lineHighlightBackground#0F1F1740
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#17683A35
  • editorCursor.foreground#E11074
  • editorGroupHeader.tabsBackground#2E3531dd
  • editorLineNumber.activeForeground#E11074
  • editorLineNumber.foreground#5D682F80
  • focusBorder#E11074
  • foreground#F2F4F5
  • input.background#0F1F17
  • input.border#ffffff15
  • input.foreground#F2F4F5
  • input.placeholderForeground#F2F4F560
  • list.activeSelectionBackground#E1107430
  • list.activeSelectionForeground#F2F4F5
  • list.highlightForeground#E11074
  • list.hoverBackground#0F1F1740
  • list.hoverForeground#F2F4F5
  • list.inactiveSelectionBackground#E1107415
  • list.inactiveSelectionForeground#F2F4F5
  • selection.background#17683A35
  • sideBar.background#0F1F17
  • sideBar.border#ffffff15
  • sideBar.foreground#F2F4F5
  • sideBarSectionHeader.background#2E353180
  • sideBarSectionHeader.foreground#F2F4F5
  • sideBarTitle.foreground#E11074
  • statusBar.background#2E3531
  • statusBar.border#ffffff15
  • statusBar.foreground#F2F4F5
  • statusBar.noFolderBackground#2E3531
  • tab.activeBackground#2E3531
  • tab.activeBorderTop#E11074
  • tab.activeForeground#F2F4F5
  • tab.border#ffffff15
  • tab.inactiveBackground#0F1F1760
  • tab.inactiveForeground#F2F4F580
  • terminal.ansiBlack#2E3531
  • terminal.ansiBlue#17683A
  • terminal.ansiCyan#8E115C
  • terminal.ansiGreen#E11074
  • terminal.ansiMagenta#9AA09A
  • terminal.ansiRed#9AA09A
  • terminal.ansiWhite#F2F4F5
  • terminal.ansiYellow#8E115C
  • terminal.background#2E3531
  • terminal.foreground#F2F4F5
  • titleBar.activeBackground#2E3531
  • titleBar.activeForeground#F2F4F5
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#2E3531
  • titleBar.inactiveForeground#F2F4F560
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#5D682Fitalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#17683Abold
storage.type, storage.modifier#17683Aitalic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#E11074
string, punctuation.definition.string, string.template, meta.template.expression#8E115C
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#9AA09A
variable, variable.other.readwrite, variable.other.object#F2F4F5
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#F2F4F5
variable.parameter, meta.parameter#F2F4F5dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#F2F4F580
keyword.operator#F2F4F5
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#8E115Cbold
entity.other.inherited-class#E11074
entity.name.tag, punctuation.definition.tag#17683A
entity.other.attribute-name#E11074
meta.diff, meta.diff.header#5D682F
markup.deleted#9AA09A
markup.inserted#E11074
markup.changed#8E115C
markup.heading, markup.heading.setext, punctuation.definition.heading#E11074bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#8E115C
string.other.link.title, string.other.link.description#E11074
markup.underline.link#5D682Funderline
punctuation.definition.list#17683A
markup.quote, punctuation.definition.quote#5D682Fitalic