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#374234
  • activityBar.border#31362f
  • activityBar.foreground#ffffff
  • activityBarBadge.background#ffa2ff
  • activityBarBadge.foreground#ffffff
  • editor.background#1c1d1c
  • editor.foreground#ffffff
  • editor.lineHighlightBackground#001d00
  • editor.selection#003300
  • editor.selectionBorder#004500
  • editorBracketMatch.background#003e00
  • editorBracketMatch.border#004a05
  • editorGroupHeader.tabsBackground#1c1d1c
  • editorIndentGuide.background#101110
  • foreground#ffffff
  • sideBar.background#1c1d1c
  • sideBar.border#31362f
  • sideBar.foreground#ffffff
  • sideBarSectionHeader.background#374234
  • sideBarSectionHeader.foreground#ffffff
  • statusBar.background#374234
  • statusBar.border#31362f
  • tab.activeBackground#1c1d1c
  • tab.activeForeground#ffffff
  • tab.border#31362f
  • tab.inactiveBackground#1c1d1c
  • tab.inactiveForeground#5e5e5e
  • widget.shadow#101110

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment, string.quoted.docstring, string.quoted.docstring punctuation.definition.string#6d5962italic
keyword, storage.modifier, storage.type#ff96c9
variable, string variable, string punctuation.accessor, string keyword#ffffff
meta.objectliteral punctuation.definition, meta.objectliteral meta.object-literal.key, meta.class variable.object.property#ffb2e5
markup.bold#ffb2e5bold
markup.italic#ffb2e5italic
meta.type.annotation, entity.name.type, meta.return.type, meta.type.parameters, entity.other.inherited-class, support.type, storage.type.postgres, markup.list beginning.punctuation#00d4ff
meta.parameters#ebaa67
meta.indexer.declaration variable.parameter, meta.object.type punctuation.definition, meta.type.annotation variable.object.property, punctuation.definition.typeparameters, meta.type.annotation keyword, meta.type.annotation meta.brace, meta.type.annotation punctuation, meta.type.parameters punctuation, meta.type.parameters meta.brace, markup.quote#4cf0ff
source.ts source.pgsql keyword, source.ts keyword.other.DML.sql, source.ts keyword.other.create.sql, source.ts keyword.other.order.sql#8bd392
source.ts keyword.other.DDL.create.II.sql, source.ts keyword.other.sql, source.ts keyword.other.alias.sql, source.ts support.function.expression.sql, source.ts constant.other.database-name.sql#b3c8b3
source.ts constant.other.table-name.sql#b4febb
entity.name.type.class, meta.decorator, meta.decorator variable, meta.decorator meta.function-call entity.name.function#00c6f1
support.function, markup.heading#ff96c9
meta.definition.variable, meta.parameters punctuation, meta.parameters punctuation.definition, variable.parameter, markup.heading punctuation#ffa4d7
entity.name.tag, markup.inline punctuation, markup.fenced_code punctuation#46cca5
support.class.component#00ffff
meta.definition entity.name.function, entity.name.function, support.function#ebaa67
entity.other.attribute-name, meta.tag punctuation.section, meta.tag punctuation.definition, meta.tag keyword.operator.assignment, markup.inline, markup.fenced_code#56dab3
meta.embedded string, punctuation.definition.string, string#fb989f
meta.link.inline.markdown, meta.link.inline.markdown punctuation.definition.string, meta.image.inline, meta.image.inline punctuation.definition.string#ffa5ac
string punctuation.definition.template-expression#ec8a92
variable.language#8bd392
constant#c5cb71
comment, punctuation.definition.comment, string.quoted.docstring, string.quoted.docstring punctuation.definition.string#6f5956italic
keyword, storage.modifier, storage.type#ff9c91
variable, string variable, string punctuation.accessor, string keyword#ffffff
meta.objectliteral punctuation.definition, meta.objectliteral meta.object-literal.key, meta.class variable.object.property#ffb7ac
markup.bold#ffb7acbold
markup.italic#ffb7acitalic
meta.type.annotation, entity.name.type, meta.return.type, meta.type.parameters, entity.other.inherited-class, support.type, storage.type.postgres, markup.list beginning.punctuation#e6afff
meta.parameters#b5bd6e
meta.indexer.declaration variable.parameter, meta.object.type punctuation.definition, meta.type.annotation variable.object.property, punctuation.definition.typeparameters, meta.type.annotation keyword, meta.type.annotation meta.brace, meta.type.annotation punctuation, meta.type.parameters punctuation, meta.type.parameters meta.brace, markup.quote#ffcbff
source.ts source.pgsql keyword, source.ts keyword.other.DML.sql, source.ts keyword.other.create.sql, source.ts keyword.other.order.sql#00d5ff
source.ts keyword.other.DDL.create.II.sql, source.ts keyword.other.sql, source.ts keyword.other.alias.sql, source.ts support.function.expression.sql, source.ts constant.other.database-name.sql#a6c9d6
source.ts constant.other.table-name.sql#61ffff
entity.name.type.class, meta.decorator, meta.decorator variable, meta.decorator meta.function-call entity.name.function#d7a1f1
support.function, markup.heading#ff9c91
meta.definition.variable, meta.parameters punctuation, meta.parameters punctuation.definition, variable.parameter, markup.heading punctuation#ffaa9f
entity.name.tag, markup.inline punctuation, markup.fenced_code punctuation#00cadd
support.class.component#00ffff
meta.definition entity.name.function, entity.name.function, support.function#b5bd6e
entity.other.attribute-name, meta.tag punctuation.section, meta.tag punctuation.definition, meta.tag keyword.operator.assignment, markup.inline, markup.fenced_code#2fd8eb
meta.embedded string, punctuation.definition.string, string#eca877
meta.link.inline.markdown, meta.link.inline.markdown punctuation.definition.string, meta.image.inline, meta.image.inline punctuation.definition.string#fbb584
string punctuation.definition.template-expression#dd9b6b
variable.language#00d5ff
constant#86d69d
comment, punctuation.definition.comment, string.quoted.docstring, string.quoted.docstring punctuation.definition.string#6b5b50italic
keyword, storage.modifier, storage.type#ffaf66
variable, string variable, string punctuation.accessor, string keyword#ffffff
meta.objectliteral punctuation.definition, meta.objectliteral meta.object-literal.key, meta.class variable.object.property#ffca80
markup.bold#ffca80bold
markup.italic#ffca80italic
meta.type.annotation, entity.name.type, meta.return.type, meta.type.parameters, entity.other.inherited-class, support.type, storage.type.postgres, markup.list beginning.punctuation#ff9af1
meta.parameters#77d486
meta.indexer.declaration variable.parameter, meta.object.type punctuation.definition, meta.type.annotation variable.object.property, punctuation.definition.typeparameters, meta.type.annotation keyword, meta.type.annotation meta.brace, meta.type.annotation punctuation, meta.type.parameters punctuation, meta.type.parameters meta.brace, markup.quote#ffb6ff
source.ts source.pgsql keyword, source.ts keyword.other.DML.sql, source.ts keyword.other.create.sql, source.ts keyword.other.order.sql#00ceff
source.ts keyword.other.DDL.create.II.sql, source.ts keyword.other.sql, source.ts keyword.other.alias.sql, source.ts support.function.expression.sql, source.ts constant.other.database-name.sql#a1c3d2
source.ts constant.other.table-name.sql#60f9ff
entity.name.type.class, meta.decorator, meta.decorator variable, meta.decorator meta.function-call entity.name.function#f08de3
support.function, markup.heading#ffaf66
meta.definition.variable, meta.parameters punctuation, meta.parameters punctuation.definition, variable.parameter, markup.heading punctuation#ffbc73
entity.name.tag, markup.inline punctuation, markup.fenced_code punctuation#00d0ff
support.class.component#20ffff
meta.definition entity.name.function, entity.name.function, support.function#77d486
entity.other.attribute-name, meta.tag punctuation.section, meta.tag punctuation.definition, meta.tag keyword.operator.assignment, markup.inline, markup.fenced_code#33deff
meta.embedded string, punctuation.definition.string, string#d2c076
meta.link.inline.markdown, meta.link.inline.markdown punctuation.definition.string, meta.image.inline, meta.image.inline punctuation.definition.string#e1ce83
string punctuation.definition.template-expression#c4b369
variable.language#00ceff
constant#2fe8d6
comment, punctuation.definition.comment, string.quoted.docstring, string.quoted.docstring punctuation.definition.string#655e4eitalic
keyword, storage.modifier, storage.type#e6c352
variable, string variable, string punctuation.accessor, string keyword#ffffff
meta.objectliteral punctuation.definition, meta.objectliteral meta.object-literal.key, meta.class variable.object.property#ffdf6c
markup.bold#ffdf6cbold
markup.italic#ffdf6citalic
meta.type.annotation, entity.name.type, meta.return.type, meta.type.parameters, entity.other.inherited-class, support.type, storage.type.postgres, markup.list beginning.punctuation#ff91cb
meta.parameters#00e1b1
meta.indexer.declaration variable.parameter, meta.object.type punctuation.definition, meta.type.annotation variable.object.property, punctuation.definition.typeparameters, meta.type.annotation keyword, meta.type.annotation meta.brace, meta.type.annotation punctuation, meta.type.parameters punctuation, meta.type.parameters meta.brace, markup.quote#fface7
source.ts source.pgsql keyword, source.ts keyword.other.DML.sql, source.ts keyword.other.create.sql, source.ts keyword.other.order.sql#43bdff
source.ts keyword.other.DDL.create.II.sql, source.ts keyword.other.sql, source.ts keyword.other.alias.sql, source.ts support.function.expression.sql, source.ts constant.other.database-name.sql#9cb6cb
source.ts constant.other.table-name.sql#79e7ff
entity.name.type.class, meta.decorator, meta.decorator variable, meta.decorator meta.function-call entity.name.function#f083bd
support.function, markup.heading#e6c352
meta.definition.variable, meta.parameters punctuation, meta.parameters punctuation.definition, variable.parameter, markup.heading punctuation#f6d15f
entity.name.tag, markup.inline punctuation, markup.fenced_code punctuation#57ccff
support.class.component#76ffff
meta.definition entity.name.function, entity.name.function, support.function#00e1b1
entity.other.attribute-name, meta.tag punctuation.section, meta.tag punctuation.definition, meta.tag keyword.operator.assignment, markup.inline, markup.fenced_code#69daff
meta.embedded string, punctuation.definition.string, string#b8cf85
meta.link.inline.markdown, meta.link.inline.markdown punctuation.definition.string, meta.image.inline, meta.image.inline punctuation.definition.string#c6dd92
string punctuation.definition.template-expression#abc178
variable.language#43bdff
constant#33f0ff
comment, punctuation.definition.comment, string.quoted.docstring, string.quoted.docstring punctuation.definition.string#5b6151italic
keyword, storage.modifier, storage.type#aed461
variable, string variable, string punctuation.accessor, string keyword#ffffff
meta.objectliteral punctuation.definition, meta.objectliteral meta.object-literal.key, meta.class variable.object.property#caf07b
markup.bold#caf07bbold
markup.italic#caf07bitalic
meta.type.annotation, entity.name.type, meta.return.type, meta.type.parameters, entity.other.inherited-class, support.type, storage.type.postgres, markup.list beginning.punctuation#ffa270
meta.parameters#00e2eb
meta.indexer.declaration variable.parameter, meta.object.type punctuation.definition, meta.type.annotation variable.object.property, punctuation.definition.typeparameters, meta.type.annotation keyword, meta.type.annotation meta.brace, meta.type.annotation punctuation, meta.type.parameters punctuation, meta.type.parameters meta.brace, markup.quote#ffbd8a
source.ts source.pgsql keyword, source.ts keyword.other.DML.sql, source.ts keyword.other.create.sql, source.ts keyword.other.order.sql#ef9de9
source.ts keyword.other.DDL.create.II.sql, source.ts keyword.other.sql, source.ts keyword.other.alias.sql, source.ts support.function.expression.sql, source.ts constant.other.database-name.sql#d0afcc
source.ts constant.other.table-name.sql#ffc6ff
entity.name.type.class, meta.decorator, meta.decorator variable, meta.decorator meta.function-call entity.name.function#f09564
support.function, markup.heading#aed461
meta.definition.variable, meta.parameters punctuation, meta.parameters punctuation.definition, variable.parameter, markup.heading punctuation#bce26e
entity.name.tag, markup.inline punctuation, markup.fenced_code punctuation#c9b8ff
support.class.component#ffeeff
meta.definition entity.name.function, entity.name.function, support.function#00e2eb
entity.other.attribute-name, meta.tag punctuation.section, meta.tag punctuation.definition, meta.tag keyword.operator.assignment, markup.inline, markup.fenced_code#d7c5ff
meta.embedded string, punctuation.definition.string, string#8cd7a0
meta.link.inline.markdown, meta.link.inline.markdown punctuation.definition.string, meta.image.inline, meta.image.inline punctuation.definition.string#9ae5ad
string punctuation.definition.template-expression#7fc993
variable.language#ef9de9
constant#33e9ff
comment, punctuation.definition.comment, string.quoted.docstring, string.quoted.docstring punctuation.definition.string#566457italic
keyword, storage.modifier, storage.type#64de8c
variable, string variable, string punctuation.accessor, string keyword#ffffff
meta.objectliteral punctuation.definition, meta.objectliteral meta.object-literal.key, meta.class variable.object.property#81fba7
markup.bold#81fba7bold
markup.italic#81fba7italic
meta.type.annotation, entity.name.type, meta.return.type, meta.type.parameters, entity.other.inherited-class, support.type, storage.type.postgres, markup.list beginning.punctuation#ffb759
meta.parameters#00deff
meta.indexer.declaration variable.parameter, meta.object.type punctuation.definition, meta.type.annotation variable.object.property, punctuation.definition.typeparameters, meta.type.annotation keyword, meta.type.annotation meta.brace, meta.type.annotation punctuation, meta.type.parameters punctuation, meta.type.parameters meta.brace, markup.quote#ffd373
source.ts source.pgsql keyword, source.ts keyword.other.DML.sql, source.ts keyword.other.create.sql, source.ts keyword.other.order.sql#ff98dd
source.ts keyword.other.DDL.create.II.sql, source.ts keyword.other.sql, source.ts keyword.other.alias.sql, source.ts support.function.expression.sql, source.ts constant.other.database-name.sql#d8aec8
source.ts constant.other.table-name.sql#ffc2ff
entity.name.type.class, meta.decorator, meta.decorator variable, meta.decorator meta.function-call entity.name.function#f0aa4c
support.function, markup.heading#64de8c
meta.definition.variable, meta.parameters punctuation, meta.parameters punctuation.definition, variable.parameter, markup.heading punctuation#73ec99
entity.name.tag, markup.inline punctuation, markup.fenced_code punctuation#ffa2ff
support.class.component#ffd5ff
meta.definition entity.name.function, entity.name.function, support.function#00deff
entity.other.attribute-name, meta.tag punctuation.section, meta.tag punctuation.definition, meta.tag keyword.operator.assignment, markup.inline, markup.fenced_code#ffb0ff
meta.embedded string, punctuation.definition.string, string#62ddc6
meta.link.inline.markdown, meta.link.inline.markdown punctuation.definition.string, meta.image.inline, meta.image.inline punctuation.definition.string#72ecd4
string punctuation.definition.template-expression#53cfb8
variable.language#ff98dd
constant#69daff

Shiki preview

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

Loading...