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#242C60
  • activityBar.border#ffffff15
  • activityBar.foreground#677BE9
  • activityBar.inactiveForeground#FAF7EF60
  • activityBarBadge.background#677BE9
  • activityBarBadge.foreground#242C60
  • button.background#677BE9
  • button.foreground#242C60
  • button.hoverBackground#677BE9dd
  • editor.background#242C60
  • editor.foreground#FAF7EF
  • editor.inactiveSelectionBackground#79ABEC3580
  • editor.lineHighlightBackground#171B2640
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#79ABEC35
  • editorCursor.foreground#677BE9
  • editorGroupHeader.tabsBackground#242C60dd
  • editorLineNumber.activeForeground#677BE9
  • editorLineNumber.foreground#D6C8B880
  • focusBorder#677BE9
  • foreground#FAF7EF
  • input.background#171B26
  • input.border#ffffff15
  • input.foreground#FAF7EF
  • input.placeholderForeground#FAF7EF60
  • list.activeSelectionBackground#677BE930
  • list.activeSelectionForeground#FAF7EF
  • list.highlightForeground#677BE9
  • list.hoverBackground#171B2640
  • list.hoverForeground#FAF7EF
  • list.inactiveSelectionBackground#677BE915
  • list.inactiveSelectionForeground#FAF7EF
  • selection.background#79ABEC35
  • sideBar.background#171B26
  • sideBar.border#ffffff15
  • sideBar.foreground#FAF7EF
  • sideBarSectionHeader.background#242C6080
  • sideBarSectionHeader.foreground#FAF7EF
  • sideBarTitle.foreground#677BE9
  • statusBar.background#242C60
  • statusBar.border#ffffff15
  • statusBar.foreground#FAF7EF
  • statusBar.noFolderBackground#242C60
  • tab.activeBackground#242C60
  • tab.activeBorderTop#677BE9
  • tab.activeForeground#FAF7EF
  • tab.border#ffffff15
  • tab.inactiveBackground#171B2660
  • tab.inactiveForeground#FAF7EF80
  • terminal.ansiBlack#242C60
  • terminal.ansiBlue#79ABEC
  • terminal.ansiCyan#5DE755
  • terminal.ansiGreen#677BE9
  • terminal.ansiMagenta#F1B383
  • terminal.ansiRed#F1B383
  • terminal.ansiWhite#FAF7EF
  • terminal.ansiYellow#5DE755
  • terminal.background#242C60
  • terminal.foreground#FAF7EF
  • titleBar.activeBackground#242C60
  • titleBar.activeForeground#FAF7EF
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#242C60
  • titleBar.inactiveForeground#FAF7EF60
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#D6C8B8italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#79ABECbold
storage.type, storage.modifier#79ABECitalic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#677BE9
string, punctuation.definition.string, string.template, meta.template.expression#5DE755
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#F1B383
variable, variable.other.readwrite, variable.other.object#FAF7EF
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#FAF7EF
variable.parameter, meta.parameter#FAF7EFdditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#FAF7EF80
keyword.operator#FAF7EF
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#5DE755bold
entity.other.inherited-class#677BE9
entity.name.tag, punctuation.definition.tag#79ABEC
entity.other.attribute-name#677BE9
meta.diff, meta.diff.header#D6C8B8
markup.deleted#F1B383
markup.inserted#677BE9
markup.changed#5DE755
markup.heading, markup.heading.setext, punctuation.definition.heading#677BE9bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#5DE755
string.other.link.title, string.other.link.description#677BE9
markup.underline.link#D6C8B8underline
punctuation.definition.list#79ABEC
markup.quote, punctuation.definition.quote#D6C8B8italic