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.

  • activityBarBadge.background#37972b
  • editor.background#2B2B2B
  • editor.foreground#A9B7C6
  • editor.inactiveSelectionBackground#3a3d41
  • editor.lineHighlightBackground#323232
  • editor.selectionHighlightBackground#add6ff26
  • editorError.foreground#90343288
  • editorGutter.background#272727
  • editorIndentGuide.background#404040
  • editorInfo.foreground#53975a88
  • editorWarning.foreground#79723488
  • extensionBadge.remoteBackground#37972b
  • list.dropBackground#474B4D
  • statusBar.background#272727
  • statusBarItem.remoteBackground#38972b

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
emphasisitalic
strongbold
header#000080
comment#808080
constant.language#CC7832bold
constant.numeric#D0BF69
constant.regexp#646695
entity.name.tag#FFC66D
entity.name.tag.css#d7ba7d
entity.other.attribute-name#BABABA
entity.other.attribute-name.class.css, entity.other.attribute-name.class.mixin.css, entity.other.attribute-name.id.css, entity.other.attribute-name.parent-selector.css, entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css, source.css.less entity.other.attribute-name.id, entity.other.attribute-name.attribute.scss, entity.other.attribute-name.scss#d7ba7d
invalid#f44747
markup.underlineunderline
markup.bold#A9B7C6
markup.heading#A9B7C6
markup.italicitalic
markup.inserted#b5cea8
markup.deleted#ce9178
markup.changed#A9B7C6
beginning.punctuation.definition.quote.markdown#608b4e
beginning.punctuation.definition.list.markdown#6796e6
markup.inline.raw#ce9178
meta.selector#d7ba7d
punctuation.definition.tag#FFC66D
meta.preprocessor#CC7832
meta.preprocessor.string#ce9178
meta.preprocessor.numeric#b5cea8
source.python#ffffffd9
meta.structure.dictionary.key.python#8f5aac
meta.item-access.arguments.python#cc86c9
meta.function-call.generic.python#6eb398
meta.function-call.arguments.python#999999
constant.numeric#D0BF69
keyword.control.import.python#FC5FA3
support.type.python#D0A8FF
string.quoted.single.python#FC6A5D
support.type.exception.python#109c79
entity.name.function.python#67B7A4
comment.line.number-sign.python#6C7986italic
entity.name.type.class.python#9EF1DD
entity.other.inherited-class.python#67B7A4
entity.name.function.decorator, entity.name.function.decorator support.type.python#FD8F3F
variable.parameter.function-call.python#BF8555
keyword.operator.new, keyword.operator.expression, keyword.operator.cast, keyword.operator.sizeof, keyword.operator.logical.python#FC5FA3bold
meta.diff.header#FC5FA3
meta.class.inheritance#d4d4d4ff
storagered
storage.type#FC5FA3bold
storage.modifier#FC5FA3bold
string, string storage.type.string#FC6A5D
string.quoted.docstring.multi, string.quoted.docstring.multi storage.type.string#6A8759italic bold
constant.character.escape#CC682E
punctuation.definition.template-expression.begin.js, punctuation.definition.template-expression.begin.ts, punctuation.definition.template-expression.end.ts, punctuation.definition.template-expression.end.js#A9B7C6
support.type.vendored.property-name, support.type.property-name, variable.css, variable.scss, variable.other.less#8f5aac
variable.other.property, support.variable.property.dom#8f5aac
variable.other.object, variable.other.object.property, support.class.dom, meta.function-call, entity.name.type.module#A9B7C6
variable.other.readwrite, variable.parameter, variable.other.readwrite.alias#A9B7C6
variable.parameter.function.language.special#8f5aac
keyword#FC5FA3
keyword.control#FC5FA3bold
keyword.operator#A9B7C6
keyword.other.unit#b5cea8
punctuation.section.embedded.begin.metatag.php, punctuation.section.embedded.end.metatag.php#CC7832
support.function.git-rebase#8f5aac
support.function.magic#B200B2
support.function.builtin#A167E6
constant.sha.git-rebase#b5cea8
storage.modifier.import.java, storage.modifier.package.java#d4d4d4
variable.language.special#a152a8
variable.language#CC7832bold
entity.name.function, support.function, support.constant.handlebarsbold
entity.name.typebold
meta.return-type, support.class, support.type, entity.name.type, entity.name.class, storage.type.cs, storage.type.generic.cs, storage.type.modifier.cs, storage.type.variable.cs, storage.type.annotation.java, storage.type.generic.java, storage.type.java, storage.type.object.array.java, storage.type.primitive.array.java, storage.type.primitive.java, storage.type.token.java, storage.type.groovy, storage.type.annotation.groovy, storage.type.parameters.groovy, storage.type.generic.groovy, storage.type.object.array.groovy, storage.type.primitive.array.groovy, storage.type.primitive.groovy#A9B7C6
support.class, entity.name.class, support.type, entity.name.type#A9B7C6bold
storage.type.function.arrow#A9B7C6
meta.type.cast.expr, meta.type.new.expr, support.constant.math, support.constant.dom, support.constant.json#4EC9B0
keyword.control#FC5FA3bold
meta.definition.variable.name, support.variable#A9B7C6
variable#8f5aac
meta.object-literal.key, meta.object-literal.key entity.name.function#8f5aac
support.constant.property-value, support.constant.font-name, support.constant.media-type, support.constant.media, constant.other.color.rgb-value, constant.other.rgb-value, support.constant.color#CE9178
token.info-token#6796e6
token.warn-token#cd9731
token.error-token#f44747
token.debug-token#b267e6

Shiki preview

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

Loading...