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#eeeeee
  • activityBar.foreground#808080
  • activityBarBadge.background#3e82f8
  • badge.background#3e82f8
  • editor.background#ffffff
  • editor.findMatchBackground#f2ea01
  • editor.findMatchHighlightBackground#f2ea0163
  • editor.findRangeHighlightBackground#0000ff
  • editor.foreground#222222
  • editor.lineHighlightBackground#94949455
  • editor.selectionBackground#b2d6ff
  • editor.selectionForeground#000000
  • editorCursor.foreground#4d4d4c
  • editorGroupHeader.noTabsBackground#f3f3f3
  • editorGroupHeader.tabsBackground#f3f3f3
  • editorIndentGuide.background#aaaaaa
  • editorLineNumber.foreground#808080
  • editorWhitespace.foreground#f3f3f3
  • statusBar.background#f3f3f3
  • statusBar.foreground#5a5a5a
  • statusBar.noFolderBackground#f3f3f3
  • statusBar.noFolderForeground#5a5a5a
  • tab.activeBackground#ffffff
  • tab.inactiveBackground#f3f3f3
  • terminal.ansiBlack#222222
  • terminal.ansiBrightBlack#222222
  • terminal.ansiBrightRed#c80000
  • terminal.ansiRed#c80000

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#222222ff
variable.parameter.function#4d4d4c
comment, punctuation.definition.comment#949494
punctuation.definition.string, punctuation.definition.variable, punctuation.definition.string, punctuation.definition.parameters, punctuation.definition.string, punctuation.definition.array#4d4d4c
none#4d4d4c
keyword.operator#4d4d4c
keyword#d7005f
variable#8959a8
entity.name.function, meta.require, support.function.any-method#005f87
support.class, entity.name.class, entity.name.type.class#d75f00
meta.class#262626
keyword.other.special-method#005f87
storage#d7005f
support.function#3e999f
string, constant.other.symbol, entity.other.inherited-class#718c00
constant.numeric#d75f00
none#d75f00
none#d75f00
constant#d75f00
entity.name.tag#8959a8
entity.other.attribute-name#d75f00
entity.other.attribute-name.id, punctuation.definition.entity#005f87
meta.selector#d7005f
none#d75f00
markup.heading punctuation.definition.heading, entity.name.section#005f87
keyword.other.unit#d75f00
markup.bold, punctuation.definition.bold#d75f00bold
markup.italic, punctuation.definition.italic#d7005fitalic
markup.raw.inline#718c00
string.other.link#8959a8
meta.link#d75f00
markup.list#8959a8
markup.quote#d75f00
meta.separator#4d4d4c
markup.inserted#718c00
markup.deleted#8959a8
markup.changed#d7005f
constant.other.color#3e999f
string.regexp#3e999f
constant.character.escape#3e999f
punctuation.section.embedded, variable.interpolation#df0000
invalid.illegal#f3f3f3
invalid.broken#262626
invalid.deprecated#f3f3f3
invalid.unimplemented#262626
markup.heading.markdown.punctuation.definition, markdown.entity.name.section#d70087bold
markup.markdown.meta.paragraph.inline#5f8700
markdown.meta.separator#bcbcbc
punctuation.definition.bold.markdown, punctuation.definition.italic.markdown#508aaa
punctuation.definition.string.begin.markdown, punctuation.definition.string.end.markdown#508aaa
markup.italic.markdownitalic
markup.bold.markdownbold
markup.deleted.git_gutter#e61f44
markup.inserted.git_gutter#a7da1e
markup.changed.git_gutter#f7b83d
token.info-token#316bcd
token.warn-token#cd9731
token.error-token#cd3131
token.debug-token#800080
support.function#222
keyword.operator#994500
storage#ac1391
keyword.operator.new#ac1391
keyword#ac1391
variable#3134b1
constant#ab0d8f
string.quoted.double.html#1154cc
string#c61816
punctuation.definition.string.begin.js#c61816
punctuation.definition.string.end.js#c61816
punctuation.definition.string.begin.ts#c61816
punctuation.definition.string.end.ts#c61816
punctuation.definition.string.begin.html#a894a6
punctuation.definition.string.end.html#a894a6
meta.tag.inline.any#a894a6
entity.other.attribute-name.html#994500
entity.name.tag#871280
meta.tag.sgml.doctype#c0c0c0
punctuation.definition.tag.html#a894a6
comment#236e26
punctuation.definition.comment#236e26
invalid.illegal.expected-dictionary-separator#FF0000
punctuation.definition.string.begin.css#c61816
punctuation.definition.string.end.css#c61816
keyword.operator.pattern.css#222
entity.other.attribute-name.css#222
support.constant.font-name.css#07909A
keyword.other.important.css#07909A
support.function.calc.css#07909A
entity.other.attribute-name.class#222
entity.name.tag#222
support.constant.property-value#07909A
support.function.misc.css#07909A
entity.other.attribute-name.pseudo-class.css#222
punctuation.definition.entity.css#222
punctuation.section.function.begin.bracket.round.css#222
punctuation.section.function.end.bracket.round.css#222
constant.numeric.css#3200FF
keyword.other.unit#3200FF
support.type.property-name#C80000
support.type.vendored.property-name.css#C80000
invalid.deprecated.color.system.css#07909A
meta.property-value.css#C80000
support.function.timing-function.css#C80000
punctuation.separator.list.comma.css#222
constant.numeric#1B00D4
constant.character.escape#c61816
entity.name.function#222
variable.other.object#3134b1
support.class#222
punctuation.definition.string.begin.tsx#c61816
punctuation.definition.string.end.tsx#c61816
entity.name.type.class#3134b1
entity.other.inherited-class#222
variable.language.super#ac1391
variable.language.this#ac1391
variable.other.property#222
variable.other.object.property#222
entity.other.attribute-name#994500
support.class.component#871280
punctuation.definition.string.begin.css#c61816
punctuation.definition.string.end.css#c61816
keyword.operator.pattern.css#222
entity.other.attribute-name.css#222
support.constant.font-name.css#07909A
keyword.other.important.css#07909A
support.function.calc.css#07909A
entity.other.attribute-name.class#222
entity.name.tag#222
support.constant.property-value#07909A
support.function.misc.css#07909A
entity.other.attribute-name.pseudo-class.css#222
punctuation.definition.entity.css#222
punctuation.section.function.begin.bracket.round.css#222
punctuation.section.function.end.bracket.round.css#222
constant.numeric.css#3200FF
keyword.other.unit#3200FF
support.type.property-name#C80000
support.type.vendored.property-name.css#C80000
invalid.deprecated.color.system.css#07909A
meta.property-value.css#C80000
support.function.timing-function.css#C80000
punctuation.separator.list.comma.css#222
constant.numeric#1B00D4
constant.character.escape#c61816
entity.name.function#222
variable.other.object#3134b1
support.class#222
punctuation.definition.string.begin.tsx#c61816
punctuation.definition.string.end.tsx#c61816
entity.name.type.class#3134b1
entity.other.inherited-class#222
variable.language.super#ac1391
variable.language.this#ac1391
variable.other.property#222
variable.other.object.property#222
entity.other.attribute-name#994500
support.class.component#871280