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#0f161c
  • activityBar.border#00000000
  • activityBar.foreground#4dd0e1
  • activityBar.inactiveForeground#455a64
  • editor.background#0f161c
  • editor.foreground#e0f7fa
  • editor.lineHighlightBackground#162029
  • editor.selectionBackground#1e2b38
  • editorCursor.foreground#00bcd4
  • editorGroupHeader.tabsBackground#0f161c
  • editorLineNumber.activeForeground#4dd0e1
  • editorLineNumber.foreground#37474f
  • focusBorder#00000000
  • gitDecoration.conflictingResourceForeground#c792ea
  • gitDecoration.deletedResourceForeground#f07178
  • gitDecoration.ignoredResourceForeground#455a64
  • gitDecoration.modifiedResourceForeground#ffcb6b
  • gitDecoration.untrackedResourceForeground#c3e88d
  • list.activeSelectionBackground#00bcd440
  • list.activeSelectionBorder#00000000
  • list.activeSelectionForeground#ffffff
  • list.activeSelectionIconForeground#ffffff
  • list.focusBackground#00bcd440
  • list.hoverBackground#00bcd410
  • list.inactiveSelectionBackground#00000000
  • menu.background#0f161c
  • menu.border#00000000
  • menu.foreground#e0f7fa
  • menu.selectionBackground#00bcd4
  • menu.selectionForeground#0f161c
  • notifications.background#0f161c
  • notifications.border#00bcd4
  • notifications.foreground#e0f7fa
  • panel.background#0f161c
  • panel.border#00000000
  • panelTitle.activeBackground#00bcd440
  • panelTitle.activeBorder#00000000
  • quickInput.background#162029
  • quickInput.list.focusBackground#00bcd4
  • sideBar.background#0f161c
  • sideBar.border#00000000
  • sideBar.foreground#80deea
  • sideBarSectionHeader.background#0f161c
  • statusBar.background#0f161c
  • statusBar.border#00000000
  • statusBar.foreground#80deea
  • tab.activeBackground#0f161c
  • tab.activeBorderBottom#00bcd4
  • tab.activeBorderTop#0f161c
  • tab.activeForeground#4dd0e1
  • tab.border#0f161c00
  • tab.inactiveBackground#0f161c
  • tab.inactiveForeground#546e7a
  • terminal.background#0f161c
  • titleBar.activeBackground#0f161c
  • titleBar.border#00000000

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

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