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#1b1b1b
  • activityBarBadge.background#c45832
  • breadcrumb.foreground#2e3d1e
  • button.background#c45832
  • editor.background#121212
  • editor.foreground#a1b9b9
  • menubar.selectionForeground#ea76cb
  • sideBar.background#121212
  • sideBar.border#767976
  • sideBar.foreground#8839ef
  • sideBarSectionHeader.background#1b1b1b
  • sideBarSectionHeader.foreground#ea76cb
  • sideBarTitle.foreground#bbbbbb
  • statusBar.background#c45832
  • textBlockQuote.background#A117F2
  • textLink.foreground#dd7878
  • welcomePage.background#121212
  • welcomePage.progress.background#121212
  • welcomePage.progress.foreground#fdf101
  • welcomePage.tileBackground#750080

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#6C7A89italic
variable, string constant.other.placeholder#D08770italic
constant.other.color#00f5ff
invalid, invalid.illegal#BF616A
keyword, storage.type, storage.modifier#81A1C1
keyword.control, constant.other.color, punctuation, meta.tag, punctuation.definition.tag, punctuation.separator.inheritance.php, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, punctuation.section.embedded, keyword.other.template, keyword.other.substitution#81A1C1
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#7b008a
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method#e5df2eitalic
meta.block variable.other#b48ead
support.other.variable, string.other.link#A3BE8C
constant.numeric, constant.language, support.constant, constant.character, constant.escape, variable.parameter, keyword.other.unit, keyword.other#88C0D0
string, constant.other.symbol, constant.other.key, entity.other.inherited-class, markup.heading, markup.inserted.git_gutter, meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js#04d9ff
entity.name, support.type, support.class, support.other.namespace.use.php, meta.use.php, support.other.namespace.php, markup.changed.git_gutter, support.type.sys-types#04a5e5
support.type#B2CCD6
source.css support.type.property-name, source.sass support.type.property-name, source.scss support.type.property-name, source.less support.type.property-name, source.stylus support.type.property-name, source.postcss support.type.property-name#7287fd
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#ea76cb
variable.language#FF5370italic
entity.name.method.js#dc8a78italic
meta.class-method.js entity.name.function.js, variable.function.constructor#dc8a78
entity.other.attribute-name#BE00FE
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#fffitalic
entity.other.attribute-name.class#BE00FE
entity.other.attribute-name.id#BE00FE
source.json meta.structure.dictionary.json support.type.property-name.json#ea76cb
source.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#fe640b
source.json meta.structure.dictionary.value.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#40a02b
source.json meta.structure.dictionary.value.json meta.structure.dictionary.value.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#04d9ff
source.json meta.structure.dictionary.value.json meta.structure.dictionary.value.json meta.structure.dictionary.value.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#7287fd