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