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.activeBorder#00ff00
  • activityBar.background#111111
  • activityBarBadge.background#007acc
  • editor.background#000000
  • editor.foreground#ffffff
  • editor.selectionBackground#444444
  • editor.selectionHighlightBackground#ffffff15
  • editor.wordHighlightStrongBackground#ffffff15
  • editorGroupHeader.tabsBackground#222222
  • editorIndentGuide.activeBackground#555555
  • editorIndentGuide.background#2d2d2d
  • editorLineNumber.activeForeground#00ff00
  • sideBar.background#222222
  • sideBarTitle.foreground#bbbbbb
  • statusBar.background#21252b
  • statusBar.foreground#9da5b4
  • tab.activeBackground#555555
  • tab.hoverBackground#555555
  • tab.inactiveBackground#333333

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#7f817eitalic
string#ffb46a
string.quoted.double#ffb46a
string.quoted.single, string.template.js#ffb46a
entity.name.tag, invalid.illegal.unrecognized-tag, meta.tag.sgml#2492ff
punctuation.definition.tag, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, punctuation.definition.tag.html#2492ff
punctuation.section.embedded.begin, punctuation.section.embedded.end#e10000
variable, variable.other.constant#2bb71d
variable.language#2492FF
variable.parameter#2bb71ditalic
variable.other#2bb71ditalic
variable.other.object#ff8d04
variable.other.object.property#b8d9ff
variable.other.property#a5a8ff
entity.other.attribute-name#c792ea
entity.other.inherited-class#ffb46a
keyword#2492ff
keyword.other#ffffff
keyword.operator#2492ff
keyword.control#0b93ff
storage#2492ff
storage.modifier#2492ff
constant.other.color#ffffff
constant.other#ffb46a
invalid, invalid.illegal#ff5370
meta.object-literal.key#00ff00italic
entity.name.function#0aff04
variable.function#0aff04
meta.function-call#0aff04
support.constant#ffffff
support.constant.math.js#df00df
support.function#0aff04
support.other, support.other.variable, string.other.link#f07178
support.other.namespace#ffcb6b
keyword.other.special-method#0aff04
keyword.operator.assignment#ff6106
constant.character, constant.escape#ffffff
constant.character.escape#ffffaa
constant.language#2492ff
constant.language.null, constant.language.undefined#2492ff
entity.name, support.type, support.class, markup.changed.git_gutter, support.type.sys-types#ffcb6b
variable.scss#ff25d9
source.css entity.name.tag, source.scss entity.name.tag#ffffff
entity.other.attribute-name.id, entity.other.attribute-name.id punctuation.definition.entity#00d205
entity.other.attribute-name.class, entity.other.attribute-name.class punctuation.definition.entity#b2ff02
source.css.scss entity.name.tag.css#ffffff
source.sass keyword.control#00d205
keyword.control.warn.scss#ff0000
keyword.operator.css, keyword.operator.logical.scss#0b93ff
keyword.other.important#ff3229italic
source.css meta.at-rule.charset.css keyword.control.at-rule.charset.css punctuation.definition#0b93ff
support.type#ff1190
source.css support.type.property-name, source.css.scss support.type.vendored.property-name.css, source.less support.type.property-name, source.postcss support.type.property-name, source.postcss support.type.property-name, source.sass support.type.property-name, source.sass support.type.property-name, source.scss support.type.property-name, source.stylus support.type.property-name#ff1190
support.function.transform.css, support.function.misc.scss, support.function.url.css, support.function.misc.css#e58100
source.css.scss meta.at-rule.keyframes.scss, source.css.scss meta.at-rule.keyframes.scss entity.other.attribute-name.scss#ffffff
support.constant.property-value.css#46f761
string.quoted.single.css, string.quoted.single.scss#2bb71ditalic
source.js keyword.control#2492ff
keyword.other.debugger.js#ff0000underline
support.class.console.js#ff0000underline
meta.class-method.js entity.name.function.js, meta.var.expr.js entity.name, new.expr.js entity.name.type.js, support.class, variable.function.constructor#df00df
entity.name.method.js#82aaffitalic
entity.name.module.js#ff5370
variable.import.parameter.js#ff5370
variable.other.class.js#ff5370
source.js constant.other.object.key.js string.unquoted.label.js#ff5370italic
source.vue variable#2bb71ditalic
source.vue variable.other.readwrite.js#ff1190
source.vue source.js variable.other.readwrite.js#2bb71ditalic
source.vue expression.embedded.vue variable.other.readwrite.js#fec6ff
source.vue punctuation.definition.generic#ff07a2italic
source.vue punctuation.separator.key-value.html#ffff00
source.vue punctuation.definition.template-expression.begin.js, source.vue punctuation.definition.template-expression.end.js#ffffff
source.vue source.js meta.import.js meta.block.js variable.other.readwrite.alias.js#00ff00italic
source.vue source.js meta.export.default.js meta.objectliteral.js meta.method.declaration.js meta.block.js meta.objectliteral.js meta.object.member.js meta.object-literal.key.js#00ff00italic
entity.other.attribute-name.html#00d205
meta.tag.other.html#ffffff
entity.other.attribute-name.id.html#00d205
constant.character.entity.named.amp.html, constant.character.entity.named.quot.html, constant.character.entity.named.ndash.html, constant.character.entity.named.hellip.html, constant.character.entity.named.yen.html, constant.character.entity.named.euro.html, constant.character.entity.named.reg.html, constant.character.entity.named.copy.html, constant.character.entity.named.bull.html, constant.character.entity.numeric.decimal.html#ff1190
text.html.php variable.other.php#d285cc
text.html.php variable.other.property.php#d285cc
text.html.php meta.function.php variable.other.php#2bb71d
text.html.php meta.function.php variable.other.php, text.html.php meta.method-call.php variable.other.php#2bb71d
text.html.php variable.other.global.php, text.html.php variable.other.global.safer.php#ff4028italic
text.html.php punctuation.definition.variable.php#ff25d9
text.html.php keyword.operator.class.php#ea03ff
meta.use.php#FFCB6B
support.other.namespace.use.php, support.other.namespace.php#FFCB6B
text.html.php punctuation.separator.inheritance.php#ffffff
punctuation.definition.string.begin.php, punctuation.definition.string.end.php#ffffff
string.regexp.double-quoted.php punctuation.definition.string.begin.php, string.regexp.double-quoted.php punctuation.definition.string.end.php, string.regexp.single-quoted.php punctuation.definition.string.begin.php, string.regexp.single-quoted.php punctuation.definition.string.end.php#ff0000
text.html.php punctuation.section.embedded.begin.php, text.html.php punctuation.section.embedded.end.php#e10000
text.html.php keyword.control.if.php, text.html.php keyword.control.else.php, text.html.php keyword.control.exit.php, text.html.php keyword.control.foreach.php, text.html.php keyword.control.return.php, text.html.php keyword.control.die.php#0b93ff
text.html.php string.quoted.single#fef611
text.html.php constant.other.php#bbfd0d
text.html.php support.constant.std.php#bbfd0d
text.html.php entity.name.type.class.php#df00df
text.html.php entity.other.inherited-class.php#80fcff
text.html.php storage.modifier.php, text.html.php storage.modifier.extends.php#276aff
text.html.php support.function.magic.php#e3a0ff
text.html.php storage.type.php#2492ff
text.html.php keyword.operator.ternary.php, text.html.php keyword.operator.key.php, text.html.php keyword.operator.logical.php#2492ff
text.html.php keyword.operator.comparison.php#48ffc2
text.html.php support.function.json.php, text.html.php support.function.file.php#e8e8e8italic
text.html.php constant.language.php#0b93ff
text.html.php keyword.other.phpdoc.php#3a771fitalic
text.html.php support.class.php#aaaaaaitalic
text.html.php keyword.other.type.php#aaaaaaitalic
text.html.php string.quoted.double.php, text.html.php string.quoted.double.sql.php#ff6f5b
text.html.php keyword.other.sql, text.html.php keyword.other.DML.sql, text.html.php keyword.other.DDL.create.II.sql, text.html.php keyword.other.alias.sql#ff026a
text.html.php constant.other.database-name.sql, text.html.php constant.other.table-name.sql#ffa851italic
text.html.php keyword.operator.comparison.sql#48ffc2
text.html.php support.function.aggregate.sql, text.html.php support.function.expression.sql#d4facd
source.python string.quoted.docstring.multi.python#7f817eitalic
source.python string.quoted.double.block.python#7f817eitalic
source.python#2bb71ditalic
source.python meta.function.python storage.type.function.python#0b93ff
source.python keyword.other.python#ff0000
source.python meta.function.python meta.function.parameters.python#0b93ff
string.quoted.single.single-line.raw-regex.python meta.group.regexp, constant.other.character-class.range.regexp, punctuation.definition.character-class.regexp#ffffffitalic
source.python entity.name.tag.named.group.regexp, source.python entity.name.section.group.regexp#ff1190italic
source.python meta.function.decorator.python entity.name.function.decorator.python support.function.builtin.python, source.python meta.function.decorator.python entity.name.function.decorator.python#ea03ffitalic
source.python meta.function.decorator.python entity.name.function.decorator.python punctuation.definition.decorator.python#4e5affitalic
source.python meta.structure.dictionary.python meta.structure.dictionary.value.python meta.function-call.python#ff92e4
source.python meta.structure.dictionary.value.python, source.python meta.item-access.python, source.python meta.function-call.arguments.python#2bb71ditalic
source.python meta.class.python entity.name.type.class.python#0aff04
source.python punctuation.definition.arguments.begin.python, source.python punctuation.definition.arguments.end.python, source.python punctuation.definition.dictionary.begin.python, source.python punctuation.definition.dictionary.end.python, source.python punctuation.definition.list.begin.python, source.python punctuation.definition.list.end.python#ffffff
source.python punctuation.separator.valuepair.dictionary.python#ffffff
text.html.django keyword.control.django, text.html.django keyword.control.tag-name.django#0b93ff
text.html.django constant.other.tag.name.django#0b93ff
text.html.django keyword.operator.assignment.django#0b93ff
text.html.django entity.other.django.delimiter.tag#ffffff
text.html.django entity.tag.tagbraces.django#ffffff
text.html.django meta.scope.django.variable entity.other.django.delimiter.variable#ff07a2italic
text.html.django storage.type.variable.django entity.tag.tagbraces.django#ff07a2italic
text.html.django meta.scope.django.tag variable.other.django#2bb71ditalic
text.html.django string.unquoted.tag-string.django#2bb71ditalic
text.html.django storage.type.templatetag.django constant.other.contrib.django#2bb71ditalic
text.html.django string.quoted.double.django, text.html.django string.quoted.double.html, text.html.django string.quoted.single.django, text.html.django string.quoted.single.html#ffb46a
text.html.django constant.other.filter.django#ffffff
text.html.django storage.type.variable.django string.unquoted.tag-string.django#ffffff
text.html.django string.quoted.double.html storage.type.variable.django string.unquoted.tag-string.django#2bb71ditalic
source.json string.quoted.double.json.comments#ffc266
source.json meta.structure.dictionary.json support.type.property-name.json#c792ea
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#ff1190
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#22ff31
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#dd8d04
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#147dff
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#ff5a60
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#18fffa
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#acff04
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#f50aff
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 meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#fffa02
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 meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#ff0c77
string.regexp#ffe4a6
string.regexp keyword.other#ff0000
text.html.markdown, punctuation.definition.list_item.markdown#eeffff
text.html.markdown markup.inline.raw.markdown#c792ea
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#c3e88d
markup.quote punctuation.definition.blockquote.markdown#65737E
string.other.link.title.markdown#82AAFF
string.other.link.description.title.markdown#c792ea
constant.other.reference.link.markdown#ffcb6b
markup.raw.block.fenced.markdown#00000050
punctuation.definition.fenced.markdown#00000050
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#eeffff
variable.language.fenced.markdown#65737e
meta.separator#65737ebold
markup.heading#ffb46a
markup.inserted.git_gutter#ffb46a
markup.table#eeffff
markup.italic#f07178italic
markup.bold, markup.bold string#f07178bold
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#f07178bold
markup.underline#f78c6cunderline
markup.quoteitalic
markup.raw.block#c792ea
markup.inserted#c3e88d
markup.deleted#ff5370
markup.changed#c792ea
source.shell keyword.control#0b93ff
*url*, *link*, *uri*underline

Shiki preview

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

Loading...