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#111816
  • activityBar.border#00000000
  • activityBar.ckground#111816
  • activityBar.foreground#80cbc4
  • activityBar.inactiveForeground#37474f
  • editor.background#111816
  • editor.foreground#b2ccd6
  • editor.lineHighlightBackground#16201d
  • editor.selectionBackground#1e2e2a
  • editorCursor.foreground#80cbc4
  • editorGroupHeader.tabsBackground#111816
  • editorLineNumber.activeForeground#80cbc4
  • editorLineNumber.foreground#37474f
  • focusBorder#00000000
  • gitDecoration.conflictingResourceForeground#c792ea
  • gitDecoration.deletedResourceForeground#f07178
  • gitDecoration.ignoredResourceForeground#546e7a
  • gitDecoration.modifiedResourceForeground#ffcb6b
  • gitDecoration.untrackedResourceForeground#c3e88d
  • list.activeSelectionBackground#00968840
  • list.activeSelectionBorder#00000000
  • list.activeSelectionForeground#ffffff
  • list.activeSelectionIconForeground#ffffff
  • list.focusBackground#00968840
  • list.hoverBackground#00968810
  • list.inactiveSelectionBackground#00000000
  • menu.background#111816
  • menu.border#00000000
  • menu.foreground#b2ccd6
  • menu.selectionBackground#009688
  • menu.selectionForeground#111816
  • notifications.background#111816
  • notifications.border#009688
  • notifications.foreground#b2ccd6
  • panel.background#111816
  • panel.border#00000000
  • panelTitle.activeBackground#00968840
  • panelTitle.activeBorder#00000000
  • quickInput.background#16201d
  • quickInput.list.focusBackground#009688
  • sideBar.background#111816
  • sideBar.border#00000000
  • sideBar.foreground#b2dfdb
  • sideBarSectionHeader.background#111816
  • statusBar.background#111816
  • statusBar.border#00000000
  • statusBar.foreground#b2dfdb
  • tab.activeBackground#111816
  • tab.activeBorderBottom#009688
  • tab.activeBorderTop#111816
  • tab.activeForeground#80cbc4
  • tab.border#11181600
  • tab.inactiveBackground#111816
  • tab.inactiveForeground#546e7a
  • terminal.background#111816
  • titleBar.activeBackground#111816
  • titleBar.border#00000000

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#546e7aitalic
string, string.quoted, string.template#c3e88d—
constant.numeric#f78c6c—
constant.language#f78c6c—
constant.character#f78c6c—
constant.other#f78c6c—
variable#b2ccd6—
variable.other.readwrite#b2ccd6—
variable.parameter#e57373italic
variable.language#c792eaitalic
keyword#c792eabold
keyword.control#89ddffitalic
keyword.operator#89ddff—
keyword.declaration#c792eabold
storage#c792eabold
storage.type#c792eabold
entity.name.class#ffcb6b—
entity.name.type#ffcb6b—
entity.name.function#82aaff—
entity.other.attribute-name#ffcb6bitalic
entity.name.tag#f07178—
support.function#82aaff—
support.constant#f78c6c—
support.type#ffcb6b—
support.class#ffcb6b—
support.variable#b2ccd6—
punctuation#89ddff—
meta.brace#89ddff—
meta.delimiter#89ddff—
punctuation.definition.variable#b2ccd6—
punctuation.definition.string#c3e88d—
punctuation.definition.parameters#89ddff—
punctuation.terminator#89ddff—
punctuation.separator#89ddff—
meta.function-call#82aaff—
meta.object-literal.key#b2ccd6—
source.json meta.structure.dictionary.key#80cbc4—
source.css entity.name.tag#ffcb6b—
source.css entity.other.attribute-name.class#c3e88d—
source.css entity.other.attribute-name.id#82aaff—
source.css constant.numeric#f78c6c—
source.css keyword.other.unit#f78c6c—
text.html.basic entity.other.attribute-name#ffcb6bitalic
meta.tag.custom#ffcb6b—
markup.heading#009688bold
markup.bold#c792eabold
markup.italic#c792eaitalic
markup.underline#80cbc4underline
markup.quote#546e7aitalic
markup.raw#c3e88d—
markup.inline.raw#f78c6c—
variable.annotation#ffcb6b—
meta.decorator#ffe082—
variable.other.constant#f78c6c—
variable.other.enummember#f78c6c—
meta.object.member#b2ccd6—
variable.other.property#b2ccd6—
source.python variable.parameter.function.language.special.self#c792eaitalic
source.python constant.language#ffcb6b—
source.go storage.type#c792ea—
source.go entity.name.function#82aaff—
source.java storage.modifier#c792ea—
source.java entity.name.type.class#ffcb6b—
source.ts entity.name.type.interface#ffcb6b—
source.js variable.other.object#ffcb6b—
source.js variable.other.readwrite.alias#ffcb6b—
source.shell variable.other#b2ccd6—
source.shell keyword.operator#89ddff—
punctuation.definition.tag.html#89ddff—
punctuation.definition.tag.begin.html#89ddff—
punctuation.definition.tag.end.html#89ddff—
string.regexp#80cbc4—
constant.character.escape.regexp#80cbc4—
variable.group.regexp#c3e88d—
constant.other.character-class.range.regexp#f78c6c—
keyword.operator.quantifier.regexp#89ddff—
support.type.property-name.json#80cbc4—
meta.structure.dictionary.value.json string.quoted.double.json#c3e88d—
source.yaml entity.name.tag#80cbc4—
text.xml entity.name.tag#f07178—
text.xml entity.other.attribute-name#ffcb6b—