Skip to main content
CodingTheme

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#efeff8
  • activityBar.foreground#626276
  • activityBar.inactiveForeground#828292
  • activityBarBadge.background#B486E0
  • editor.background#efeff8
  • editor.foreground#828292
  • editorGroupHeader.tabsBackground#efeff8
  • input.background#efeff8
  • sideBar.background#efeff8
  • sideBar.foreground#626276
  • sideBarTitle.background#efeff8
  • sideBarTitle.foreground#B486E0
  • statusBar.background#B486E0
  • tab.activeBackground#efeff8
  • tab.inactiveBackground#e7e7f3
  • titleBar.activeBackground#efeff8
  • titleBar.activeForeground#626276

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#a666e4bold
variable, string constant.other.placeholder#00769E
constant.other.color#a666e4
invalid, invalid.illegal#FF5370
keyword, storage.type, storage.modifier#00769E
storage.modifier.async#00769E
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#a666e4
meta.jsx.children#828292
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#00769E
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method#a58d00
meta.block variable.other#D85486
support.other.variable, string.other.link#A5562D
constant.numeric, constant.language, support.constant, constant.character, constant.escape, variable.parameter, keyword.other.unit, keyword.other#00769E
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#A5562D
entity.other.inherited-class#fcb7f6
entity.name, support.type, support.class, support.orther.namespace.use.php, meta.use.php, support.other.namespace.php, markup.changed.git_gutter, support.type.sys-types#00C29B
support.type#4D717F
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#4D717F
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#FF5370
variable.language#FF5370italic
entity.name.method.js#82AAFFitalic
meta.class-method.js entity.name.function.js, variable.function.constructor#82AAFF
entity.other.attribute-name#814EA0
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#A06C00italic
entity.other.attribute-name.class#A06C00
source.sass keyword.control#82AAFF
markup.inserted#8AB82F
markup.deleted#FF5370
markup.changed#814EA0
string.regexp#0079A2
constant.character.escape#0079A2
*url*, *link*, *uri*underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#82AAFFitalic
source.js constant.other.object.key.js string.unquoted.label.js#FF5370italic
source.json meta.structure.dictionary.json support.type.property-name.json#814EA0
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#A06C00
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#A5562D
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#FF5370
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#C17E70
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#82AAFF
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#A5562D
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#814EA0
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#8AB82F
text.html.markdown, punctuation.definition.list_item.markdown#828292
text.html.markdown markup.inline.raw.markdown#814EA0
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#65737E
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown#8AB82F
markup.italic#A5562Ditalic
markup.bold, markup.bold string#A5562Dbold
markup.bold markup.italic, markup.italic markup.bold, markup.quote markup.bold, markup.bold markup.italic string, markup.italic markup.bold string, markup.quote markup.bold string#A5562Dbold
markup.underline#A5562Dunderline
markup.quote punctuation.definition.blockquote.markdown#a666e4
markup.quoteitalic
string.other.link.title.markdown#82AAFF
string.other.link.description.title.markdown#814EA0
constant.other.reference.link.markdown#A06C00
markup.raw.block#814EA0
markup.raw.block.fenced.markdown#a666e4
punctuation.definition.fenced.markdown#a666e4
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#828292
variable.language.fenced.markdown#a666e4
meta.separator#a666e4bold
markup.table#828292

Shiki preview

TypeScript sample highlighted with this variant's colors and tokenColors.

Loading...