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#fbfbfb
  • activityBar.foreground#090910
  • activityBarBadge.background#E3F1F6
  • activityBarBadge.foreground#090909
  • editor.background#fbfbfb
  • editor.foreground#090910
  • editor.inactiveSelectionBackground#E7E8F2
  • editor.selectionBackground#E7E8F2
  • editor.selectionHighlightBackground#E7E8F2
  • editorIndentGuide.background#e6e6e6
  • editorLineNumber.activeForeground#808080
  • editorLineNumber.foreground#aaaaaa
  • list.activeSelectionBackground#055472
  • list.focusOutline#055472
  • sideBar.background#fbfbfb
  • sideBar.border#e6e6e6
  • sideBarSectionHeader.background#E3F1F6
  • statusBar.background#fbfbfb
  • statusBar.debuggingBackground#ca473f
  • statusBar.foreground#090910

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#93939e
string constant.other.placeholder, punctuation, meta.function-call.arguments, constant.character, variable.#090910
invalid, invalid.illegal#981d15
keyword, storage.type, storage.modifier, keyword.control, keyword.other#055472
constant.other.color, meta.tag, punctuation.definition.tag, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, punctuation.section.embedded, keyword.other.template, keyword.other.substitution, keyword.other.unit#090910
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method, entity.other.inherited-class#ca473f
constant.numeric, constant.language, support.constant, constant.escape#981d15
string, constant.other.symbol, constant.other.key, markup.heading, punctuation.definition.string.begin, punctuation.definition.string.end, markup.inserted.git_gutter, meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js#690
entity.name, support.type, support.class, markup.changed.git_gutter, support.type.sys-types#ca473f
support.type#ca473f
variable.language#0782b1
string.regexp#0782b1
constant.character.escape#0782b1
support.function.builtin.python#0782b1
entity.name.function.decorator.python, punctuation.definition.decorator.python#0782b1
variable.other#090910
meta.jsx.children.js string#055472
variable.language.this.php punctuation.definition.variable.php, punctuation.definition.variable.php, variable.other.php#0782B1
keyword.operator.class.php, support.class.php, support.other.namespace.php, punctuation.separator.inheritance.php, entity.name.type.namespace#090910
comment.block.documentation.phpdoc.php support.class.php, comment.block.documentation.phpdoc.php support.other.namespace.php, comment.block.documentation.phpdoc.php punctuation.separator.inheritance.php, comment.block.documentation.phpdoc.php punctuation.separator.delimiter.php, comment.block.documentation.phpdoc.php keyword.other, comment.block.documentation.phpdoc.php support.class.builtin.php#93939E
entity.name.tag#981d15
punctuation.definition.tag, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html#090910
meta.tag#690
string.quoted.double.html, punctuation.definition.string.end.html, punctuation.definition.string.begin.html#055472
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#090910
entity.other.attribute-name.class#055472
source.css keyword.other.unit#981D15
support.type.property-name.json, punctuation.support.type.property-name.begin.json, punctuation.support.type.property-name.end.json#055472
storage.type.templatetag.django#ca473f
storage.type.variable.django#090910
string.unquoted.tag-string.django#0782B1
keyword.blade, support.function.construct.begin.blade, support.function.construct.end.blade#ca473f
support.function.construct.begin.blade, support.function.construct.end.blade#090910

Shiki preview

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

Loading...