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.activeBackground#bfd2f5
  • activityBar.activeBorder#007acc
  • activityBar.activeFocusBorder#007acc
  • activityBar.background#f0f0f0
  • activityBar.border#00000018
  • activityBar.dropBorder#e9524d
  • activityBar.foreground#303030
  • activityBar.inactiveForeground#30303088
  • activityBarBadge.background#007acc
  • activityBarBadge.foreground#ffffff
  • badge.background#007acc
  • badge.foreground#ffffff
  • dropdown.border#00000018
  • editor.background#ffffff
  • editor.findMatchBackground#00000020
  • editor.findMatchHighlightBackground#00000030
  • editor.findRangeHighlightBackground#00000020
  • editor.foreground#303030
  • editor.hoverHighlightBackground#00000010
  • editor.lineHighlightBackground#00000008
  • editor.rangeHighlightBackground#00000010
  • editor.selectionBackground#00000020
  • editor.selectionHighlightBackground#00000030
  • editor.wordHighlightBackground#00000020
  • editor.wordHighlightStrongBackground#00000030
  • editorCursor.background#ffffff
  • editorCursor.foreground#303030
  • editorGroupHeader.tabsBackground#f0f0f0
  • editorGroupHeader.tabsBorder#00000018
  • editorIndentGuide.activeBackground#00000020
  • editorIndentGuide.background#00000018
  • editorLineNumber.activeForeground#777777
  • editorLineNumber.foreground#bbbbbb
  • input.border#00000018
  • list.activeSelectionBackground#e8e8e8
  • list.activeSelectionForeground#000000
  • list.hoverBackground#f0f0f0
  • list.inactiveSelectionBackground#f0f0f0
  • panel.border#00000018
  • scrollbar.shadow#dddddd
  • scrollbarSlider.activeBackground#007acc66
  • scrollbarSlider.background#64646466
  • scrollbarSlider.hoverBackground#007acc66
  • sideBar.background#f8f8f8
  • sideBar.border#00000018
  • sideBarSectionHeader.background#f0f0f0
  • sideBarSectionHeader.border#00000018
  • statusBar.background#bfd2f5
  • statusBar.border#00000018
  • statusBar.debuggingBackground#edf1b4
  • statusBar.foreground#303030
  • statusBar.noFolderBackground#ffffff
  • tab.activeBackground#ffffff
  • tab.border#00000018
  • tab.inactiveBackground#f0f0f0

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
meta.embedded, source.groovy.embedded#303030
emphasisitalic
strongbold
header#000080
comment#AAAAAA
constant.language#0066CC
constant.numeric#CC6600
constant.regexp#CC6600
entity.name.tag#0066CC
entity.name.tag.css#0066CC
entity.other.attribute-name#009900
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#0066CC
invalid#FF6666
markup.underlineunderline
markup.bold#0066CCbold
markup.heading#0066CCbold
markup.italicitalic
markup.inserted#CC6600
markup.deleted#CC6600
markup.changed#0066CC
beginning.punctuation.definition.quote.markdown#AAAAAA
beginning.punctuation.definition.list.markdown#66CC99
markup.inline.raw#CC6600
meta.selector#999966
punctuation.definition.tag#303030
meta.preprocessor#0066CC
meta.preprocessor.string#CC6600
meta.preprocessor.numeric#CC6600
meta.structure.dictionary.key.python#009900
meta.diff.header#0066CC
storage#0066CC
storage.type#0066CC
storage.modifier#0066CC
string#CC6600
string.tag#CC6600
string.value#CC6600
string.regexp#CC6600
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded#0066CC
meta.template.expression#303030
support.type.vendored.property-name, support.type.property-name, variable.css, variable.scss, variable.other.less, source.coffee.embedded#009900
keyword#0066CC
keyword.control#0066CC
keyword.operator#303030
keyword.operator.new, keyword.operator.expression, keyword.operator.cast, keyword.operator.sizeof, keyword.operator.instanceof, keyword.operator.logical.python#0066CC
keyword.other.unit#CC6600
punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php#0066CC
support.function.git-rebase#009900
constant.sha.git-rebase#CC6600
storage.modifier.import.java, variable.language.wildcard.java, storage.modifier.package.java#303030
variable.language#0066CC
entity.name.function, support.function, support.constant.handlebars#883399
meta.return-type, support.class, support.type, entity.name.type, 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.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.parameters.groovy, storage.type.generic.groovy, storage.type.object.array.groovy, storage.type.primitive.array.groovy, storage.type.primitive.groovy#009999
storage.type.annotation.java, storage.type.annotation.groovy#0cb800
meta.type.cast.expr, meta.type.new.expr, support.constant.math, support.constant.dom, support.constant.json, entity.other.inherited-class#009999
keyword.control#0066CC
variable, meta.definition.variable.name, support.variable, entity.name.variable#009900
meta.object-literal.key#009900
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#CC6600
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#CC6600
constant.character.character-class.regexp, constant.other.character-class.set.regexp, constant.other.character-class.regexp, constant.character.set.regexp#CC6600
keyword.operator.or.regexp, keyword.control.anchor.regexp#CC6600
keyword.operator.quantifier.regexp#CC6600
constant.character#0066CC
constant.character.escape#CC6600
token.info-token#66CC99
token.warn-token#FF6666
token.error-token#FF6666
token.debug-token#CC66CC
variable#000000
entity.name.variable#000000