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#22262B
  • activityBar.border#ffffff15
  • activityBar.foreground#67BEE9
  • activityBar.inactiveForeground#f2f4f260
  • activityBarBadge.background#67BEE9
  • activityBarBadge.foreground#22262B
  • button.background#67BEE9
  • button.foreground#22262B
  • button.hoverBackground#67BEE9dd
  • editor.background#22262B
  • editor.foreground#f2f4f2
  • editor.inactiveSelectionBackground#A3EC793580
  • editor.lineHighlightBackground#08090C40
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#A3EC7935
  • editorCursor.foreground#67BEE9
  • editorGroupHeader.tabsBackground#22262Bdd
  • editorLineNumber.activeForeground#67BEE9
  • editorLineNumber.foreground#58636b80
  • focusBorder#67BEE9
  • foreground#f2f4f2
  • input.background#08090C
  • input.border#ffffff15
  • input.foreground#f2f4f2
  • input.placeholderForeground#f2f4f260
  • list.activeSelectionBackground#67BEE930
  • list.activeSelectionForeground#f2f4f2
  • list.highlightForeground#67BEE9
  • list.hoverBackground#08090C40
  • list.hoverForeground#f2f4f2
  • list.inactiveSelectionBackground#67BEE915
  • list.inactiveSelectionForeground#f2f4f2
  • selection.background#A3EC7935
  • sideBar.background#08090C
  • sideBar.border#ffffff15
  • sideBar.foreground#f2f4f2
  • sideBarSectionHeader.background#22262B80
  • sideBarSectionHeader.foreground#f2f4f2
  • sideBarTitle.foreground#67BEE9
  • statusBar.background#22262B
  • statusBar.border#ffffff15
  • statusBar.foreground#f2f4f2
  • statusBar.noFolderBackground#22262B
  • tab.activeBackground#22262B
  • tab.activeBorderTop#67BEE9
  • tab.activeForeground#f2f4f2
  • tab.border#ffffff15
  • tab.inactiveBackground#08090C60
  • tab.inactiveForeground#f2f4f280
  • terminal.ansiBlack#22262B
  • terminal.ansiBlue#A3EC79
  • terminal.ansiCyan#CFE755
  • terminal.ansiGreen#67BEE9
  • terminal.ansiMagenta#F19783
  • terminal.ansiRed#F19783
  • terminal.ansiWhite#f2f4f2
  • terminal.ansiYellow#CFE755
  • terminal.background#22262B
  • terminal.foreground#f2f4f2
  • titleBar.activeBackground#22262B
  • titleBar.activeForeground#f2f4f2
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#22262B
  • titleBar.inactiveForeground#f2f4f260
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#58636bitalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#A3EC79bold
storage.type, storage.modifier#A3EC79italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#67BEE9
string, punctuation.definition.string, string.template, meta.template.expression#CFE755
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#F19783
variable, variable.other.readwrite, variable.other.object#f2f4f2
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#f2f4f2
variable.parameter, meta.parameter#f2f4f2dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#f2f4f280
keyword.operator#f2f4f2
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#CFE755bold
entity.other.inherited-class#67BEE9
entity.name.tag, punctuation.definition.tag#A3EC79
entity.other.attribute-name#67BEE9
meta.diff, meta.diff.header#58636b
markup.deleted#F19783
markup.inserted#67BEE9
markup.changed#CFE755
markup.heading, markup.heading.setext, punctuation.definition.heading#67BEE9bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#CFE755
string.other.link.title, string.other.link.description#67BEE9
markup.underline.link#58636bunderline
punctuation.definition.list#A3EC79
markup.quote, punctuation.definition.quote#58636bitalic