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.

  • editor.background#ffffff
  • editor.foreground#000000
  • editor.lineHighlightBackground#ecebeb
  • editorLineNumber.foreground#ccc
  • sideBar.foreground#000
  • statusBar.background#ffffff
  • statusBar.border#ffffff
  • statusBar.debuggingBackground#fafbfc
  • statusBar.debuggingForeground#24292e
  • statusBar.foreground#24292e
  • statusBar.noFolderBackground#fafbfc
  • statusBar.noFolderForeground#24292e

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment, comment.block.preprocessor, comment.documentation, comment.block.documentation, comment.block.documentation support.class, comment.block.documentation keyword.other.type, string.quoted.docstring.multi.python#808080
invalid.illegal#660000
source#000
keyword.operator#333
keyword.other, keyword.control, storage, keyword.operator.logical, storage.type, keyword.operator.type.php, keyword.operator.expression.of.js, keyword.operator.new#080086bold
entity.name.exception, constant.character.escape#080086bold
string#008300bold
support.constant, variable.language, constant.numeric, constant.language, support.constant.math, support.type#1C00FFbold
variable#70007Fbold
support.class, entity.name.type, meta.function entity.name.function, meta.definition.method entity.name.function, entity.other.inherited-class, storage.modifier.import#000
support.variable, entity.name.type.namespace.php#000
keyword.other.class.php, meta.use support.class, meta.function-call entity.name.function#000
support.function.magic#7A7B3A
support.function, support.variable.property#000
string.regexp, constant.character.set.regexp, keyword.operator.quantifier.regexp#008000
variable.language.this#94558D
variable.parameter.function.language.special.self.python, variable.language.special.self.python#94558D
meta.function.decorator support.type, entity.name.function.decorator#0000B5
keyword.operator.expression.in.js, keyword.operator.expression.typeof.js#000086bold
meta.tag.sgml.doctype, meta.tag.sgml.doctype string, meta.tag.sgml.doctype entity.name.tag, meta.tag.sgml punctuation.definition.tag.html#999
meta.tag, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, constant.character.entity, punctuation.definition.entity#333
entity.name.tag#000080bold
meta.tag entity.other.attribute-name, entity.other.attribute-name.html#0000FFbold
string.quoted.double.html#008000bold
text.html#000bold
meta.selector.css, meta.selector entity punctuation, entity.name.tag.css#000080
meta.selector entity, punctuation.definition.entity.css#BE504D
meta.property-name, support.type.property-name#660E7A
meta.property-value, meta.property-value constant.other, support.constant.property-value, source.css constant.numeric, source.css constant.language, source.css keyword.other.unit#008000
source.css keyword.control#0000FF
punctuation.section.tag.twig#2B91AF
variable.other.django.block, variable.other.django#000
keyword.control.twig#D2413A
support.constant.laravel-blade#2B91AF
keyword.blade#BE504D
source.php.embedded.line.html variable.other.php, source.php.embedded.line.html punctuation.definition.variable.php#000
support.type.property-name.json#660E7A
string.quoted.double.json#008000
string.quoted.double.xml, string.quoted.single.xml#008000

Shiki preview

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

Loading...

Webstorm JetBrains Theme - Coding Theme