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#23252e
  • activityBar.foreground#D7DAE0
  • activityBar.inactiveForeground#5F6672
  • activityBarBadge.background#528bff
  • activityBarBadge.foreground#F8FAFD
  • button.background#528bff
  • diffEditor.insertedTextBackground#00809B33
  • dropdown.background#1d1f23
  • dropdown.border#181A1F
  • editor.background#1f232b
  • editor.findMatchBorder#457dffbd
  • editor.lineHighlightBackground#2c313c
  • editor.selectionBackground#67769660
  • editor.selectionHighlightBackground#ffffff10
  • editorCursor.foreground#f8f8f0
  • editorError.foreground#c24038
  • editorGroup.border#181A1F
  • editorGroupHeader.tabsBackground#21252B
  • editorHoverWidget.background#21252B
  • editorHoverWidget.border#181A1F
  • editorIndentGuide.background1#3B4048
  • editorLineNumber.activeForeground#50bbf8
  • editorLineNumber.foreground#495162
  • editorRuler.foreground#484848
  • editorSuggestWidget.background#21252B
  • editorWhitespace.foreground#484a50
  • editorWidget.background#21252B
  • input.background#1d1f23
  • list.activeSelectionBackground#03385e
  • list.activeSelectionForeground#d7dae0
  • list.focusBackground#2c313c
  • list.highlightForeground#C5C5C5
  • list.hoverBackground#292d35
  • list.inactiveSelectionBackground#2c313a
  • list.inactiveSelectionForeground#d7dae0
  • scrollbarSlider.activeBackground#747D9180
  • scrollbarSlider.background#4E566680
  • scrollbarSlider.hoverBackground#5A637580
  • sideBar.background#21252b
  • sideBarSectionHeader.background#1f232b
  • statusBar.background#21252B
  • statusBar.debuggingBackground#21252B
  • statusBar.foreground#9da5b4
  • statusBar.noFolderBackground#21252B
  • statusBarItem.hoverBackground#2c313a
  • tab.activeBackground#1F232B
  • tab.activeBorderTop#9e9e9e
  • tab.border#181A1F
  • tab.hoverBackground#323842
  • tab.inactiveBackground#2b2d32
  • titleBar.activeBackground#1f232b
  • titleBar.activeForeground#9da5b4
  • titleBar.inactiveBackground#1f232b
  • titleBar.inactiveForeground#6B717D

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
meta.embedded, source.groovy.embedded, string meta.image.inline.markdown, variable.legacy.builtin.python#D4D4D4
emphasisitalic
strongbold
header#000080
comment, string.comment#9e9c9cd5italic
constant.language#61afef
constant.numeric, variable.other.enummember, keyword.operator.plus.exponent, keyword.operator.minus.exponent#56b6c2
constant.regexp#646695
entity.name.tag#e06c75
support.type.property-name#D7BA7D
entity.other.attribute-name#95c673
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#95c673
invalid#F44747
markup.underlineunderline
markup.bold#e06c75bold
markup.heading#e06c75bold
markup.italicitalic
markup.strikethroughstrikethrough
markup.inserted#56b6c2
markup.deleted#e5c07b
markup.changed#e06c75
punctuation.definition.quote.begin.markdown#6A9955
punctuation.definition.list.begin.markdown#6796E6
markup.inline.raw#e5c07b
punctuation.definition.tag#abb2bf
meta.preprocessor, entity.name.function.preprocessor#e06c75
meta.preprocessor.string#e5c07b
meta.preprocessor.numeric#56b6c2
meta.structure.dictionary.key.python#abb2bf
meta.diff.header#e06c75
storage#e06c75
storage.type#e06c75
storage.modifier, keyword.operator.noexcept#e06c75
string, meta.embedded.assembly#e5c07b
string.tag#e5c07b
string.value#e5c07b
string.regexp#e06c75
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded#e06c75
meta.template.expression#D4D4D4
support.type.vendored.property-name, variable.css, variable.scss, source.coffee.embedded#e5c07b
variable.other.less#61afef
support.other.variable.less, punctuation.definition.variable.less#8abde7
keyword#e06c75
keyword.control#e06c75
keyword.operator#e06c75
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#e06c75
keyword.other.unit#56b6c2
punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php#e06c75
support.function.git-rebase#abb2bf
constant.sha.git-rebase#56b6c2
storage.modifier.import.java, variable.language.wildcard.java, storage.modifier.package.java#D4D4D4
variable.language#e06c75
entity.name.function, support.function, support.constant.handlebars, source.powershell variable.other.member, entity.name.operator.custom-literal#95c673
variable.parameter#d19a66
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#56b6c2
meta.type.cast.expr, meta.type.new.expr, support.constant.math, support.constant.dom, support.constant.json, support.type.property-name.json, entity.other.inherited-class#56b6c2
keyword.control, source.cpp keyword.operator.new, keyword.operator.delete, keyword.other.using, keyword.other.directive.using, keyword.other.operator, entity.name.operator#e06c75
variable, meta.definition.variable.name, support.variable, entity.name.variable, constant.other.placeholder#abb2bf
variable.other.constant.object, variable.other.enummember#8abde7
meta.object-literal.key#abb2bf
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#e06c75
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#e5c07b
constant.character.character-class.regexp, constant.other.character-class.set.regexp, constant.other.character-class.regexp, constant.character.set.regexp#e06c75
keyword.operator.or.regexp, keyword.control.anchor.regexp#95c673
keyword.operator.quantifier.regexp#D7BA7D
constant.character, constant.other.option#e06c75
constant.character.escape#D7BA7D
entity.name.label#C8C8C8
token.info-token#6796E6
token.warn-token#CD9731
token.error-token#F44747
token.debug-token#B267E6