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#f0f0f0
  • activityBar.foreground#ff0000
  • activityBarBadge.background#ff4500
  • button.background#ff00ff
  • dropdown.background#87ceeb
  • dropdown.border#ffa07a
  • dropdown.foreground#000000
  • editor.background#ffffff
  • editor.foreground#070
  • editor.lineHighlightBackground#e0e0e0
  • editorLineNumber.foreground#888888
  • input.background#f0e68c
  • input.border#20b2aa
  • input.foreground#000000
  • scrollbarSlider.activeBackground#8ed348
  • scrollbarSlider.background#b0e57c
  • scrollbarSlider.hoverBackground#9edd58
  • sideBar.background#f5f5f5
  • statusBar.background#ffa500
  • statusBar.foreground#ffffff
  • statusBarItem.hoverBackground#ff69b4
  • terminal.foreground#9400d3
  • titleBar.activeBackground#00ff00
  • titleBar.activeForeground#000000
  • titleBar.inactiveBackground#add8e6
  • titleBar.inactiveForeground#000000

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#aaaitalic
string#f20bold
entity.name.function#0000ffbold
variable#800080bold
keyword#ff1493bold
constant#8b0000bold
constant.numeric#483d8bbold
support.type.property-name.json#09Fbold
string.quoted.double#ff1493bold
support.type.property-name.css#09Fbold
constant.numeric.css#09Fbold
entity.name.tag.html——
entity.other.attribute-name.html#0000ffbold
string.quoted.double.html#f20bold
comment.block.html#aaaitalic
text.html.basic#800080—
markdown.heading#ff1493bold
markdown.italic#800080italic
markdown.bold#0000ffbold
markdown.quote#aaaitalic
markdown.list, markdown.list.numbered, markdown.list.unnumbered#483d8bbold
markdown.code#09Fbold
markup.inline.raw#f20bold
constant.character.entity.html#483d8bbold
meta.tag.metadata.script.html#09Fbold
entity.name.tag.script.html#ff1493bold
source.python—bold
storage.type.function.python#0000ffbold
keyword.control.python#ff1493bold
string.quoted.single.python#800080bold
storage.type.java#ff1493bold
storage.modifier.java#ff1493bold

Shiki preview

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

Loading...