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#24343b
  • activityBar.border#ffffff15
  • activityBar.foreground#f25f45
  • activityBar.inactiveForeground#f8f7f160
  • activityBarBadge.background#f25f45
  • activityBarBadge.foreground#24343b
  • button.background#f25f45
  • button.foreground#24343b
  • button.hoverBackground#f25f45dd
  • editor.background#24343b
  • editor.foreground#f8f7f1
  • editor.inactiveSelectionBackground#f28c283580
  • editor.lineHighlightBackground#17191a40
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#f28c2835
  • editorCursor.foreground#f25f45
  • editorGroupHeader.tabsBackground#24343bdd
  • editorLineNumber.activeForeground#f25f45
  • editorLineNumber.foreground#7f817b80
  • focusBorder#f25f45
  • foreground#f8f7f1
  • input.background#17191a
  • input.border#ffffff15
  • input.foreground#f8f7f1
  • input.placeholderForeground#f8f7f160
  • list.activeSelectionBackground#f25f4530
  • list.activeSelectionForeground#f8f7f1
  • list.highlightForeground#f25f45
  • list.hoverBackground#17191a40
  • list.hoverForeground#f8f7f1
  • list.inactiveSelectionBackground#f25f4515
  • list.inactiveSelectionForeground#f8f7f1
  • selection.background#f28c2835
  • sideBar.background#17191a
  • sideBar.border#ffffff15
  • sideBar.foreground#f8f7f1
  • sideBarSectionHeader.background#24343b80
  • sideBarSectionHeader.foreground#f8f7f1
  • sideBarTitle.foreground#f25f45
  • statusBar.background#24343b
  • statusBar.border#ffffff15
  • statusBar.foreground#f8f7f1
  • statusBar.noFolderBackground#24343b
  • tab.activeBackground#24343b
  • tab.activeBorderTop#f25f45
  • tab.activeForeground#f8f7f1
  • tab.border#ffffff15
  • tab.inactiveBackground#17191a60
  • tab.inactiveForeground#f8f7f180
  • terminal.ansiBlack#24343b
  • terminal.ansiBlue#f28c28
  • terminal.ansiCyan#247c9f
  • terminal.ansiGreen#f25f45
  • terminal.ansiMagenta#9bd2dc
  • terminal.ansiRed#9bd2dc
  • terminal.ansiWhite#f8f7f1
  • terminal.ansiYellow#247c9f
  • terminal.background#24343b
  • terminal.foreground#f8f7f1
  • titleBar.activeBackground#24343b
  • titleBar.activeForeground#f8f7f1
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#24343b
  • titleBar.inactiveForeground#f8f7f160
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#7f817bitalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#f28c28bold
storage.type, storage.modifier#f28c28italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#f25f45
string, punctuation.definition.string, string.template, meta.template.expression#247c9f
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#9bd2dc
variable, variable.other.readwrite, variable.other.object#f8f7f1
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#f8f7f1
variable.parameter, meta.parameter#f8f7f1dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#f8f7f180
keyword.operator#f8f7f1
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#247c9fbold
entity.other.inherited-class#f25f45
entity.name.tag, punctuation.definition.tag#f28c28
entity.other.attribute-name#f25f45
meta.diff, meta.diff.header#7f817b
markup.deleted#9bd2dc
markup.inserted#f25f45
markup.changed#247c9f
markup.heading, markup.heading.setext, punctuation.definition.heading#f25f45bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#247c9f
string.other.link.title, string.other.link.description#f25f45
markup.underline.link#7f817bunderline
punctuation.definition.list#f28c28
markup.quote, punctuation.definition.quote#7f817bitalic