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.activeBackground#1564a5
  • activityBar.background#61b8ff
  • activityBar.border#0065b8
  • activityBar.foreground#063053
  • activityBarBadge.background#61b8ff
  • activityBarBadge.foreground#063053
  • badge.background#063053
  • badge.foreground#61b8ff
  • editor.background#ffffff
  • editor.findMatchBackground#43e273
  • editor.findMatchHighlightBackground#43e27377
  • editor.foreground#3366ff
  • editor.selectionBackground#dee7ff
  • editor.selectionHighlightBackground#dee7ff77
  • editorLineNumber.activeForeground#000000
  • editorLineNumber.foreground#3366ff
  • editorUnnecessaryCode.opacity#000000aa
  • minimapSlider.activeBackground#43e273aa
  • minimapSlider.background#43e27377
  • minimapSlider.hoverBackground#43e273aa
  • scrollbarSlider.activeBackground#43e273aa
  • scrollbarSlider.background#43e27377
  • scrollbarSlider.hoverBackground#43e273aa
  • sideBar.background#61b8ff
  • sideBar.foreground#063053
  • sideBarSectionHeader.background#1564a5
  • sideBarSectionHeader.foreground#61b8ff
  • statusBar.background#61b8ff
  • statusBar.border#0065b8
  • statusBar.debuggingBackground#61b8ff
  • statusBar.foreground#063053
  • statusBar.noFolderBackground#61b8ff
  • titleBar.activeBackground#61b8ff
  • titleBar.activeForeground#063053
  • titleBar.border#0065b8

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#15b846
invalid.illegal#ff0000
keyword, storage, punctuation, meta.brace#3366ff
storage.type, support.type#ff9a16
constant.language, support.constant, variable.language#3366ff
variable, support.variable, support.function, entity.other, support.class, entity.name, meta.object.member#ff8251
constant.numeric, constant.character, constant, string, punctuation.definition.string#ffa783
meta.diff.range, meta.diff.index, meta.separator#434343
meta.diff.header.from-file#434343
meta.diff.header.to-file#434343
flowers by fiddleplum - VS Code Theme