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. A key in the color catalog links to its detail page.

keyHEXRGBRGBA
activityBarBadge.background
debugToolBar.border
editor.background
editor.inactiveSelectionBackground
editor.selectionBackground
editor.selectionHighlightBackground
editorLineNumber.activeForeground
gitDecoration.untrackedResourceForeground
input.placeholderForeground
list.hoverBackground
list.hoverForeground
list.inactiveSelectionBackground
list.inactiveSelectionForeground
menu.background
menu.foreground
menu.selectionBackground
menu.selectionBorder
menu.selectionForeground
sideBarSectionHeader.background
sideBarSectionHeader.border
sideBarTitle.foreground
statusBar.background
statusBar.debuggingBackground
statusBar.debuggingBorder
statusBar.debuggingForeground
statusBar.foreground
statusBarItem.remoteBackground
statusBarItem.remoteForeground
tab.activeBackground
tab.activeBorderTop
tab.activeForeground
tab.hoverBackground
terminal.foreground
titleBar.activeBackground

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
meta.embedded, source.groovy.embedded#D4D4D4—
emphasis—italic
strong—bold
header#000080—
comment#757882—
constant.regexp#646695—
entity.name.tag#569CD6—
invalid#F44747—
markup.underline—underline
markup.bold#569CD6bold
markup.heading#569CD6bold
markup.italic—italic
markup.inserted#c6fb20—
markup.deleted#CDA48C—
markup.changed#569CD6—
punctuation.definition.quote.begin.markdown#757882—
punctuation.definition.list.begin.markdown#6796E6—
markup.inline.raw#CDA48C—
punctuation.definition.tag#808080—
meta.preprocessor, entity.name.function.preprocessor#569CD6—
meta.preprocessor.string#CDA48C—
meta.preprocessor.numeric#c6fb20—
meta.structure.dictionary.key.python#09e1ed—
meta.diff.header#569CD6—
storage#569CD6—
string.tag#CDA48C—
string.value#CDA48C—
string.regexp#D16969—
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded#F48FB1italic
meta.template.expression#D4D4D4—
keyword#569CD6—
keyword.control#569CD6italic
keyword.other.unit#c6fb20—
punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php#569CD6—
support.function.git-rebase#09e1ed—
constant.sha.git-rebase#c6fb20—
storage.modifier.import.java, variable.language.wildcard.java, storage.modifier.package.java#D4D4D4—
variable.language#569CD6italic
meta.type.cast.expr, meta.type.new.expr, support.constant.math, support.constant.dom, support.constant.json, entity.other.inherited-class#00cb8a—
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#CDA48C—
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#FFECB3—
keyword.operator.quantifier.regexp#D7BA7D—
constant.character#569CD6—
constant.character.escape#D7BA7D—
entity.name.label#C8C8C8—
token.info-token#6796E6—
token.warn-token#CD9731—
token.error-token#F44747—
token.debug-token#B267E6—
meta.decorator punctuation.decorator—italic
keyword.generator.asterisk#FFD54F—
constant.numeric, variable.other.enummember, keyword.operator.plus.exponent, keyword.operator.minus.exponent#c6fb20—
constant.language#ff9500—
support.type.vendored.property-name, support.type.property-name, variable.css, variable.scss, variable.other.less, source.coffee.embedded#09e1ed—
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#f5f5f7—
entity.name.tag.css#ff9500—
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, meta.property-name.css, meta.property-list.css#ffb91b—
entity.other.attribute-name#7bd4feitalic
string, meta.embedded.assembly#e1effd—
storage.type#0aa6ed—
variable.other.readwrite.js.jsx, entity.other.attribute-name, variable.other.constant.js, variable.other.constant.ts, variable.other.enummember#4FC1FF—
keyword.control, source.cpp keyword.operator.new, keyword.operator.delete, keyword.other.using, keyword.other.operator, entity.name.operator#f47ee4italic
keyword.control.flow#ff8b9fitalic
storage.modifier, keyword.operator.noexcept#ff8b9fitalic
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#e28a20italic
punctuation.separator.key-value.html#e28a20—
keyword.operator#FFD54F—
entity.name.function, support.function, support.constant.handlebars, source.powershell variable.other.member, entity.name.operator.custom-literal, variable.other.readwrite.alias.js.jsx, variable.other.readwrite.alias.ts#FFECB3italic
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#00cb8a—
variable, variable.other.readwrite.js.jsx#83dfff—
meta.object-literal.key, meta.object-literal.key entity.name.function, variable.other.object.property, support.variable.property#82ffccbold
variable.other.property, entity.name.variable, meta.definition.variable.name, support.variable, variable.other.object.property, meta.decorator variable.other.readwrite#1becabitalic
keyword.operator.logical, punctuation.accessor.optional#ff6982—
storage.type.function.arrow—bold
punctuation.definition.tag, entity.name.tag——