Skip to main content
CodingTheme

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#464775
  • activityBar.dropBackground#46477520
  • activityBar.foreground#f8f8f8
  • activityBarBadge.background#FFFFFF
  • activityBarBadge.foreground#464775
  • editor.background#f3f2f1
  • editor.findMatchBackground#46477520
  • editor.findMatchHighlightBackground#46477530
  • editor.findRangeHighlightBackground#46477520
  • editor.foreground#464775
  • editor.hoverHighlightBackground#46477510
  • editor.lineHighlightBackground#46477508
  • editor.rangeHighlightBackground#46477510
  • editor.selectionBackground#46477520
  • editor.selectionHighlightBackground#46477530
  • editor.wordHighlightBackground#46477520
  • editor.wordHighlightStrongBackground#46477530
  • editorCursor.background#f3f2f1
  • editorCursor.foreground#464775
  • editorGroupHeader.tabsBackground#f0f0f0
  • editorIndentGuide.activeBackground#46477520
  • editorIndentGuide.background#46477518
  • editorLineNumber.activeForeground#777777
  • editorLineNumber.foreground#bbbbbb
  • list.activeSelectionBackground#61f2c460
  • list.activeSelectionForeground#464775
  • list.hoverBackground#f7f7f7
  • list.inactiveSelectionBackground#f7f7f7
  • sideBar.background#f3f2f1
  • sideBarSectionHeader.background#f0f0f0
  • statusBar.background#e8e8e8
  • statusBar.debuggingBackground#446688
  • statusBar.foreground#464775
  • statusBar.noFolderBackground#e8e8e8
  • statusBar.noFolderForeground#464775
  • tab.activeBackground#f3f2f1
  • tab.border#46477520
  • tab.inactiveBackground#f0f0f0

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
meta.embedded, source.groovy.embedded#464775
emphasisitalic
strongbold
header#000080
comment#878787
constant.language#9933CC
constant.numeric#464775
constant.regexp#464775
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#464775
markup.deleted#464775
markup.changed#9933CC
beginning.punctuation.definition.quote.markdown#AAAAAA
beginning.punctuation.definition.list.markdown#66CC99
markup.inline.raw#464775
meta.selector#999966
punctuation.definition.tag#464775
meta.preprocessor#9933CC
meta.preprocessor.string#464775
meta.preprocessor.numeric#464775
meta.structure.dictionary.key.python#446688
meta.diff.header#9933CC
storage#9933CC
storage.type#9933CC
storage.modifier#9933CC
string#464775
string.tag#464775
string.value#464775
string.regexp#464775
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded#9933CC
meta.template.expression#464775
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#464775
keyword.operator.new, keyword.operator.expression, keyword.operator.cast, keyword.operator.sizeof, keyword.operator.instanceof, keyword.operator.logical.python#9933CC
keyword.other.unit#464775
punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php#9933CC
support.function.git-rebase#446688
constant.sha.git-rebase#464775
storage.modifier.import.java, variable.language.wildcard.java, storage.modifier.package.java#464775
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#464775
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#464775
constant.character.character-class.regexp, constant.other.character-class.set.regexp, constant.other.character-class.regexp, constant.character.set.regexp#464775
keyword.operator.or.regexp, keyword.control.anchor.regexp#464775
keyword.operator.quantifier.regexp#464775
constant.character#9933CC
constant.character.escape#464775
token.info-token#66CC99
token.warn-token#FF0000
token.error-token#FF0000
token.debug-token#CC66CC
variable#464775
entity.name.variable#464775

Shiki preview

TypeScript sample highlighted with this variant's colors and tokenColors.

Loading...

Teams by almzau - VS Code Theme