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.

  • activityBarBadge.background#007ACC
  • editor.background#1E1E1E
  • editor.foreground#D4D4D4
  • editor.inactiveSelectionBackground#3A3D41
  • editor.selectionHighlightBackground#ADD6FF26
  • editorIndentGuide.activeBackground#707070
  • editorIndentGuide.background#404040
  • input.placeholderForeground#A6A6A6
  • list.dropBackground#383B3D
  • menu.background#252526
  • menu.foreground#CCCCCC
  • settings.numberInputBackground#292929
  • settings.textInputBackground#292929
  • sideBarSectionHeader.background#0000
  • sideBarSectionHeader.border#ccc3
  • sideBarTitle.foreground#BBBBBB
  • statusBarItem.remoteBackground#16825D
  • statusBarItem.remoteForeground#FFF

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
meta.decorator.ts—underline
punctuation.decorator.ts#ff1515—
punctuation.terminator#58fcee—
punctuation.separator.key-value.ts#ffffff—
punctuation.definition.typeparameters.begin.ts, punctuation.definition.typeparameters.end.ts#d162c8italic
variable.other.readwrite.alias#71c89citalic
punctuation.definition.block.tag.jsdoc#85c8ff
storage.type.class.jsdoc#569CD6
entity.name.type.instance.jsdoc#4EC9B0italic
variable.other.jsdoc#9CDCFEitalic
entity.name.type.ts#4EC9B0—
comment.line.double-slash.ts#505050—
variable.language.this, keyword.operator.expression.instanceof.ts, keyword.operator.expression.typeof.ts#569CD6italic
keyword.control.flow—italic bold
keyword.control.as.ts#d162c8italic
keyword.operator.type.annotation.ts#4EC9B0—
new.expr.ts—italic
keyword.operator.type.ts, keyword.operator.logical.ts#ff1515—
keyword.operator.new.ts#d162c8italic underline
keyword.control.trycatch.ts—bold
variable.other.object.ts#4EC9B0—
keyword.control.loop.ts—italic
storage.modifier.async.ts—italic
keyword.operator.expression.keyof.ts, storage.type.property.ts#55b0fa—
keyword.operator.rest.ts#f1cd29—
keyword.operator.ternary.ts—italic bold
variable.other.constant.ts, variable.other.constant.object.ts—bold
storage.type.function.arrow.ts#ff15b9italic bold
constant.numeric.decimal.ts—bold
meta.decorator.ts—underline
punctuation.decorator.ts#ff1515—
punctuation.terminator#58fcee—
punctuation.separator.key-value.ts#ffffff—
punctuation.definition.typeparameters.begin.ts, punctuation.definition.typeparameters.end.ts#d162c8italic
variable.other.readwrite.alias#71c89citalic
punctuation.definition.block.tag.jsdoc#85c8ff
storage.type.class.jsdoc#569CD6
entity.name.type.instance.jsdoc#4EC9B0italic
variable.other.jsdoc#9CDCFEitalic
entity.name.type.ts#4EC9B0—
comment.line.double-slash.ts#505050—
variable.language.this, keyword.operator.expression.instanceof.ts, keyword.operator.expression.typeof.ts#569CD6italic
keyword.control.flow—italic bold
keyword.control.as.ts#d162c8italic
keyword.operator.type.annotation.ts#4EC9B0—
new.expr.ts—italic
keyword.operator.type.ts, keyword.operator.logical.ts#ff1515—
keyword.operator.new.ts#d162c8italic underline
keyword.control.trycatch.ts—bold
variable.other.object.ts#4EC9B0—
keyword.control.loop.ts—italic
storage.modifier.async.ts—italic
keyword.operator.expression.keyof.ts, storage.type.property.ts#55b0fa—
keyword.operator.rest.ts#f1cd29—
keyword.operator.ternary.ts—italic bold
variable.other.constant.ts, variable.other.constant.object.ts—bold
storage.type.function.arrow.ts#ff15b9italic bold
constant.numeric.decimal.ts—bold
entity.name.function, support.function, support.constant.handlebars, source.powershell variable.other.member, entity.name.operator.custom-literal#DCDCAA—
meta.return-type, support.class, support.type, entity.name.type, entity.name.namespace, entity.other.attribute, entity.name.scope-resolution, entity.name.class, storage.type.numeric.go, storage.type.byte.go, storage.type.boolean.go, storage.type.string.go, storage.type.uintptr.go, storage.type.error.go, storage.type.rune.go, 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#4EC9B0—
meta.type.cast.expr, meta.type.new.expr, support.constant.math, support.constant.dom, support.constant.json, entity.other.inherited-class#4EC9B0—
keyword.control, source.cpp keyword.operator.new, keyword.operator.delete, keyword.other.using, keyword.other.operator, entity.name.operator#C586C0—
variable, meta.definition.variable.name, support.variable, entity.name.variable#9CDCFE—
variable.other.constant, variable.other.enummember#4FC1FF—
meta.object-literal.key#9CDCFE—
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—
punctuation.definition.group.regexp, punctuation.definition.group.assertion.regexp, punctuation.definition.character-class.regexp, punctuation.character.set.begin.regexp, punctuation.character.set.end.regexp, keyword.operator.negation.regexp, support.other.parenthesis.regexp#CE9178—
constant.character.character-class.regexp, constant.other.character-class.set.regexp, constant.other.character-class.regexp, constant.character.set.regexp#d16969—
keyword.operator.or.regexp, keyword.control.anchor.regexp#DCDCAA—
keyword.operator.quantifier.regexp#d7ba7d—
constant.character#569cd6—
constant.character.escape#d7ba7d—
entity.name.label#C8C8C8—
meta.decorator.ts—underline
punctuation.decorator.ts#ff1515—
punctuation.terminator#58fcee—
punctuation.separator.key-value.ts#ffffff—
punctuation.definition.typeparameters.begin.ts, punctuation.definition.typeparameters.end.ts#d162c8italic
variable.other.readwrite.alias#71c89citalic
punctuation.definition.block.tag.jsdoc#85c8ff
storage.type.class.jsdoc#569CD6
entity.name.type.instance.jsdoc#4EC9B0italic
variable.other.jsdoc#9CDCFEitalic
entity.name.type.ts#4EC9B0—
comment.line.double-slash.ts#505050—
variable.language.this, keyword.operator.expression.instanceof.ts, keyword.operator.expression.typeof.ts#569CD6italic
keyword.control.flow—italic bold
keyword.control.as.ts#d162c8italic
keyword.operator.type.annotation.ts#4EC9B0—
new.expr.ts—italic
keyword.operator.type.ts, keyword.operator.logical.ts#ff1515—
keyword.operator.new.ts#d162c8italic underline
keyword.control.trycatch.ts—bold
variable.other.object.ts#4EC9B0—
keyword.control.loop.ts—italic
storage.modifier.async.ts—italic
keyword.operator.expression.keyof.ts, storage.type.property.ts#55b0fa—
keyword.operator.rest.ts#f1cd29—
keyword.operator.ternary.ts—italic bold
variable.other.constant.ts, variable.other.constant.object.ts—bold
storage.type.function.arrow.ts#ff15b9italic bold
constant.numeric.decimal.ts—bold
entity.name.function, support.function, support.constant.handlebars, source.powershell variable.other.member, entity.name.operator.custom-literal#DCDCAA—
meta.return-type, support.class, support.type, entity.name.type, entity.name.namespace, entity.other.attribute, entity.name.scope-resolution, entity.name.class, storage.type.numeric.go, storage.type.byte.go, storage.type.boolean.go, storage.type.string.go, storage.type.uintptr.go, storage.type.error.go, storage.type.rune.go, 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#4EC9B0—
meta.type.cast.expr, meta.type.new.expr, support.constant.math, support.constant.dom, support.constant.json, entity.other.inherited-class#4EC9B0—
keyword.control, source.cpp keyword.operator.new, keyword.operator.delete, keyword.other.using, keyword.other.operator, entity.name.operator#C586C0—
variable, meta.definition.variable.name, support.variable, entity.name.variable#9CDCFE—
variable.other.constant, variable.other.enummember#4FC1FF—
meta.object-literal.key#9CDCFE—
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—
punctuation.definition.group.regexp, punctuation.definition.group.assertion.regexp, punctuation.definition.character-class.regexp, punctuation.character.set.begin.regexp, punctuation.character.set.end.regexp, keyword.operator.negation.regexp, support.other.parenthesis.regexp#CE9178—
constant.character.character-class.regexp, constant.other.character-class.set.regexp, constant.other.character-class.regexp, constant.character.set.regexp#d16969—
keyword.operator.or.regexp, keyword.control.anchor.regexp#DCDCAA—
keyword.operator.quantifier.regexp#d7ba7d—
constant.character#569cd6—
constant.character.escape#d7ba7d—
entity.name.label#C8C8C8—
meta.embedded, source.groovy.embedded#D4D4D4—
emphasis—italic
strong—bold
header#000080—
comment#6A9955—
constant.language#569cd6—
constant.numeric, variable.other.enummember, keyword.operator.plus.exponent, keyword.operator.minus.exponent#b5cea8—
constant.regexp#646695—
entity.name.tag#569cd6—
entity.name.tag.css#d7ba7d—
entity.other.attribute-name#9cdcfe—
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.underline—underline
markup.bold#569cd6bold
markup.heading#569cd6bold
markup.italic—italic
markup.inserted#b5cea8—
markup.deleted#ce9178—
markup.changed#569cd6—
punctuation.definition.quote.begin.markdown#6A9955—
punctuation.definition.list.begin.markdown#6796e6—
markup.inline.raw#ce9178—
punctuation.definition.tag#808080—
meta.preprocessor, entity.name.function.preprocessor#569cd6—
meta.preprocessor.string#ce9178—
meta.preprocessor.numeric#b5cea8—
meta.structure.dictionary.key.python#9cdcfe—
meta.diff.header#569cd6—
storage#569cd6—
storage.type#569cd6—
storage.modifier, keyword.operator.noexcept#569cd6—
string, meta.embedded.assembly#ce9178—
string.tag#ce9178—
string.value#ce9178—
string.regexp#d16969—
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded#569cd6—
meta.template.expression#d4d4d4—
support.type.vendored.property-name, support.type.property-name, variable.css, variable.scss, variable.other.less, source.coffee.embedded#9cdcfe—
keyword#569cd6—
keyword.control#569cd6—
keyword.operator#d4d4d4—
keyword.operator.new, keyword.operator.expression, keyword.operator.cast, keyword.operator.sizeof, keyword.operator.alignof, keyword.operator.typeid, keyword.operator.alignas, keyword.operator.instanceof, keyword.operator.logical.python, keyword.operator.wordlike#569cd6—
keyword.other.unit#b5cea8—
punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php#569cd6—
support.function.git-rebase#9cdcfe—
constant.sha.git-rebase#b5cea8—
storage.modifier.import.java, variable.language.wildcard.java, storage.modifier.package.java#d4d4d4—
variable.language#569cd6—
meta.decorator.ts—underline
punctuation.decorator.ts#ff1515—
punctuation.terminator#58fcee—
punctuation.separator.key-value.ts#ffffff—
punctuation.definition.typeparameters.begin.ts, punctuation.definition.typeparameters.end.ts#d162c8italic
variable.other.readwrite.alias#71c89citalic
punctuation.definition.block.tag.jsdoc#85c8ff
storage.type.class.jsdoc#569CD6
entity.name.type.instance.jsdoc#4EC9B0italic
variable.other.jsdoc#9CDCFEitalic
entity.name.type.ts#4EC9B0—
comment.line.double-slash.ts#505050—
variable.language.this, keyword.operator.expression.instanceof.ts, keyword.operator.expression.typeof.ts#569CD6italic
keyword.control.flow—italic bold
keyword.control.as.ts#d162c8italic
keyword.operator.type.annotation.ts#4EC9B0—
new.expr.ts—italic
keyword.operator.type.ts, keyword.operator.logical.ts#ff1515—
keyword.operator.new.ts#d162c8italic underline
keyword.control.trycatch.ts—bold
variable.other.object.ts#4EC9B0—
keyword.control.loop.ts—italic
storage.modifier.async.ts—italic
keyword.operator.expression.keyof.ts, storage.type.property.ts#55b0fa—
keyword.operator.rest.ts#f1cd29—
keyword.operator.ternary.ts—italic bold
variable.other.constant.ts, variable.other.constant.object.ts—bold
storage.type.function.arrow.ts#ff15b9italic bold
constant.numeric.decimal.ts—bold
entity.name.function, support.function, support.constant.handlebars, source.powershell variable.other.member, entity.name.operator.custom-literal#DCDCAA—
meta.return-type, support.class, support.type, entity.name.type, entity.name.namespace, entity.other.attribute, entity.name.scope-resolution, entity.name.class, storage.type.numeric.go, storage.type.byte.go, storage.type.boolean.go, storage.type.string.go, storage.type.uintptr.go, storage.type.error.go, storage.type.rune.go, 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#4EC9B0—
meta.type.cast.expr, meta.type.new.expr, support.constant.math, support.constant.dom, support.constant.json, entity.other.inherited-class#4EC9B0—
keyword.control, source.cpp keyword.operator.new, keyword.operator.delete, keyword.other.using, keyword.other.operator, entity.name.operator#C586C0—
variable, meta.definition.variable.name, support.variable, entity.name.variable#9CDCFE—
variable.other.constant, variable.other.enummember#4FC1FF—
meta.object-literal.key#9CDCFE—
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—
punctuation.definition.group.regexp, punctuation.definition.group.assertion.regexp, punctuation.definition.character-class.regexp, punctuation.character.set.begin.regexp, punctuation.character.set.end.regexp, keyword.operator.negation.regexp, support.other.parenthesis.regexp#CE9178—
constant.character.character-class.regexp, constant.other.character-class.set.regexp, constant.other.character-class.regexp, constant.character.set.regexp#d16969—
keyword.operator.or.regexp, keyword.control.anchor.regexp#DCDCAA—
keyword.operator.quantifier.regexp#d7ba7d—
constant.character#569cd6—
constant.character.escape#d7ba7d—
entity.name.label#C8C8C8—
meta.embedded, source.groovy.embedded#D4D4D4—
emphasis—italic
strong—bold
header#000080—
comment#6A9955—
constant.language#569cd6—
constant.numeric, variable.other.enummember, keyword.operator.plus.exponent, keyword.operator.minus.exponent#b5cea8—
constant.regexp#646695—
entity.name.tag#569cd6—
entity.name.tag.css#d7ba7d—
entity.other.attribute-name#9cdcfe—
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.underline—underline
markup.bold#569cd6bold
markup.heading#569cd6bold
markup.italic—italic
markup.inserted#b5cea8—
markup.deleted#ce9178—
markup.changed#569cd6—
punctuation.definition.quote.begin.markdown#6A9955—
punctuation.definition.list.begin.markdown#6796e6—
markup.inline.raw#ce9178—
punctuation.definition.tag#808080—
meta.preprocessor, entity.name.function.preprocessor#569cd6—
meta.preprocessor.string#ce9178—
meta.preprocessor.numeric#b5cea8—
meta.structure.dictionary.key.python#9cdcfe—
meta.diff.header#569cd6—
storage#569cd6—
storage.type#569cd6—
storage.modifier, keyword.operator.noexcept#569cd6—
string, meta.embedded.assembly#ce9178—
string.tag#ce9178—
string.value#ce9178—
string.regexp#d16969—
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded#569cd6—
meta.template.expression#d4d4d4—
support.type.vendored.property-name, support.type.property-name, variable.css, variable.scss, variable.other.less, source.coffee.embedded#9cdcfe—
keyword#569cd6—
keyword.control#569cd6—
keyword.operator#d4d4d4—
keyword.operator.new, keyword.operator.expression, keyword.operator.cast, keyword.operator.sizeof, keyword.operator.alignof, keyword.operator.typeid, keyword.operator.alignas, keyword.operator.instanceof, keyword.operator.logical.python, keyword.operator.wordlike#569cd6—
keyword.other.unit#b5cea8—
punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php#569cd6—
support.function.git-rebase#9cdcfe—
constant.sha.git-rebase#b5cea8—
storage.modifier.import.java, variable.language.wildcard.java, storage.modifier.package.java#d4d4d4—
variable.language#569cd6—