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#000000
  • activityBarBadge.background#ffee00
  • activityBarBadge.foreground#000000
  • editor.background#000000
  • editor.foreground#eeffff
  • editor.inactiveSelectionBackground#3A3D41
  • editor.selectionHighlightBackground#ADD6FF26
  • editorIndentGuide.activeBackground#707070
  • editorIndentGuide.background#404040
  • editorWidget.border#ffee00
  • focusBorder#ffee00
  • input.placeholderForeground#A6A6A6
  • list.dropBackground#383B3D
  • menu.background#111111
  • menu.foreground#d1d1d1
  • panel.border#bebebe
  • sideBar.background#000000
  • sideBarSectionHeader.background#474747
  • sideBarSectionHeader.border#ccc3
  • sideBarTitle.foreground#bbbbbb
  • statusBar.background#000000
  • statusBarItem.remoteBackground#16825D
  • statusBarItem.remoteForeground#FFF
  • tab.lastPinnedBorder#cc3
  • titleBar.activeBackground#111111

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
meta.embedded, source.groovy.embedded#D4D4D4
emphasisitalic
strongbold
header#000080
comment#c2c2c2italic
constant.language#569cd6
constant.numeric, variable.other.enummember, keyword.operator.plus.exponent, keyword.operator.minus.exponent#b5cea8
constant.regexp#646695
entity.name.tag#00d8ff
entity.name.tag.css#f2f2f2
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.scss#6c9ef8
invalid#dc322f
markup.underlineunderline
markup.bold#569cd6bold
markup.heading#569cd6bold
markup.italicitalic
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#8be9fd
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#f2f2f2
variable.css, variable.scss, variable.other.less#efbc6b
punctuation.section.property-list.begin.bracket.curly.scss, punctuation.section.property-list.end.bracket.curly.scss#569cd6
entity.other.attribute-name.pseudo-class.css#ff8336
support.class.component.js#00d8ff
string.quoted.double.html, string.quoted.single.tsx, string.quoted.single.ts, string.quoted.double.tsx, string.quoted.double.ts, keyword.operator.type.annotation.ts, keyword.operator.type.ts, string.quoted.double.js, string.quoted.double.json, string.quoted.double.scss, string.quoted.double.env, string.other.link.title, markup.inline.raw.string#ecf1a9
string.quoted.single.js, entity.name.type.interface.ts, entity.name.type.class.tsx#ffffff
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
entity.name.function, support.function, support.constant.handlebars, source.powershell variable.other.member, entity.name.operator.custom-literal, punctuation.decorator.tsx#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#6097b9
meta.type.cast.expr, meta.type.new.expr, support.constant.math, support.constant.dom, support.constant.json, entity.other.inherited-class#6097b9
keyword.control, source.cpp keyword.operator.new, keyword.operator.delete, keyword.other.using, keyword.other.operator, entity.name.operator#c79fc4
variable, meta.definition.variable.name, support.variable, entity.name.variable, support.type.primitive.ts, support.type.primitive.tsx#9CDCFE
variable.other.constant, variable.other.enummember, string.template.tsx, string.template.ts, variable.object.property, keyword.operator.type.annotation.tsx#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#8be9fd
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#6c9ef8
constant.character#569cd6
constant.character.escape#6c9ef8
entity.name.label#C8C8C8