Skip to main content
Coding Theme

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#24292e
  • editor.background#ffffff
  • editor.foreground#24292e
  • editor.lineHighlightBackground#fffbdd
  • editorBracketMatch.background#f1f8ff
  • editorBracketMatch.border#c8e1ff
  • editorIndentGuide.background#eee
  • editorLineNumber.foreground#ccc
  • focusBorder#fafbfc
  • notification.background#54a3ff
  • sideBar.background#fafbfc
  • sideBar.border#ddd
  • sideBar.foreground#586069
  • sideBarSectionHeader.background#fafbfc
  • sideBarSectionHeader.foreground#24292e
  • sideBarTitle.foreground#24292e
  • statusBar.background#fafbfc
  • statusBar.border#ddd
  • statusBar.debuggingBackground#fafbfc
  • statusBar.debuggingForeground#24292e
  • statusBar.foreground#24292e
  • statusBar.noFolderBackground#fafbfc
  • statusBar.noFolderForeground#24292e

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
emphasisitalic
strongbold
comment#6a737d
string#032f62
constant.numeric, constant.language.null, variable.language.this, support.type.primitive, support.function, support.variable.dom, support.variable.property, support.variable.property, meta.property-name, meta.property-value, support.constant.handlebars#005cc5
keyword, storage.modifier, storage.type, variable.parameter#d73a49
entity.name.type, entity.other.inherited-class, meta.function-call, entity.other.attribute-name, entity.name.function.shell#6f42c1
entity.name.tag#22863a

Shiki preview

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

Loading...

Github Theme - Coding Theme