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#0ac1cc
  • activityBar.dropBackground#28207d20
  • activityBar.foreground#f8f8f8
  • activityBarBadge.background#FFFFFF
  • activityBarBadge.foreground#28207d
  • editor.background#f8f8f8
  • editor.findMatchBackground#28207d20
  • editor.findMatchHighlightBackground#28207d30
  • editor.findRangeHighlightBackground#28207d20
  • editor.foreground#28207d
  • editor.hoverHighlightBackground#28207d10
  • editor.lineHighlightBackground#28207d08
  • editor.rangeHighlightBackground#28207d10
  • editor.selectionBackground#28207d20
  • editor.selectionHighlightBackground#28207d30
  • editor.wordHighlightBackground#28207d20
  • editor.wordHighlightStrongBackground#28207d30
  • editorCursor.background#f8f8f8
  • editorCursor.foreground#28207d
  • editorGroupHeader.tabsBackground#f0f0f0
  • editorIndentGuide.activeBackground#28207d20
  • editorIndentGuide.background#28207d18
  • editorLineNumber.activeForeground#777777
  • editorLineNumber.foreground#bbbbbb
  • list.activeSelectionBackground#61f2c460
  • list.activeSelectionForeground#28207d
  • list.hoverBackground#f0f0f0
  • list.inactiveSelectionBackground#f0f0f0
  • sideBar.background#f8f8f8
  • sideBarSectionHeader.background#f0f0f0
  • statusBar.background#e8e8e8
  • statusBar.debuggingBackground#446688
  • statusBar.foreground#28207d
  • statusBar.noFolderBackground#e8e8e8
  • statusBar.noFolderForeground#28207d
  • tab.activeBackground#f8f8f8
  • tab.border#28207d20
  • tab.inactiveBackground#f0f0f0

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
meta.embedded, source.groovy.embedded#28207d
emphasisitalic
strongbold
header#000080
comment#878787
constant.language#9933CC
constant.numeric#0ac1cc
constant.regexp#0ac1cc
entity.name.tag#9933CC
entity.name.tag.css#9933CC
entity.other.attribute-name#446688
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#9933CC
invalid#FF0000
markup.underlineunderline
markup.bold#9933CCbold
markup.heading#9933CCbold
markup.italicitalic
markup.inserted#0ac1cc
markup.deleted#0ac1cc
markup.changed#9933CC
beginning.punctuation.definition.quote.markdown#AAAAAA
beginning.punctuation.definition.list.markdown#66CC99
markup.inline.raw#0ac1cc
meta.selector#999966
punctuation.definition.tag#28207d
meta.preprocessor#9933CC
meta.preprocessor.string#0ac1cc
meta.preprocessor.numeric#0ac1cc
meta.structure.dictionary.key.python#446688
meta.diff.header#9933CC
storage#9933CC
storage.type#9933CC
storage.modifier#9933CC
string#
string.tag#0ac1cc
string.value#0ac1cc
string.regexp#0ac1cc
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded#9933CC
meta.template.expression#28207d
support.type.vendored.property-name, support.type.property-name, variable.css, variable.scss, variable.other.less, source.coffee.embedded#446688
keyword#9933CC
keyword.control#9933CC
keyword.operator#28207d
keyword.operator.new, keyword.operator.expression, keyword.operator.cast, keyword.operator.sizeof, keyword.operator.instanceof, keyword.operator.logical.python#9933CC
keyword.other.unit#0ac1cc
punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php#9933CC
support.function.git-rebase#446688
constant.sha.git-rebase#0ac1cc
storage.modifier.import.java, variable.language.wildcard.java, storage.modifier.package.java#28207d
variable.language#9933CC
entity.name.function, support.function, support.constant.handlebars#446688
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.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#009999
meta.type.cast.expr, meta.type.new.expr, support.constant.math, support.constant.dom, support.constant.json, entity.other.inherited-class#009999
keyword.control#9933CC
variable, meta.definition.variable.name, support.variable, entity.name.variable#446688
meta.object-literal.key#446688
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#0ac1cc
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#0ac1cc
constant.character.character-class.regexp, constant.other.character-class.set.regexp, constant.other.character-class.regexp, constant.character.set.regexp#0ac1cc
keyword.operator.or.regexp, keyword.control.anchor.regexp#0ac1cc
keyword.operator.quantifier.regexp#0ac1cc
constant.character#9933CC
constant.character.escape#0ac1cc
token.info-token#66CC99
token.warn-token#FF0000
token.error-token#FF0000
token.debug-token#CC66CC
variable#28207d
entity.name.variable#28207d
variable.other.php#7f44dd
ThemeDatabase All Themes by enes ozturk - VS Code Theme