Skip to main content
Coding Theme

Workbench Themes

Publisher: ParticleThemes in package: 2

(Subcomponent) Dark and light themes for Workbench.

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#030b15
  • activityBar.border#0d1c29
  • activityBarBadge.background#00334f
  • activityBarBadge.foreground#ffffff
  • button.background#00E1FF
  • button.foreground#ffffff
  • button.hoverBackground#0075C9
  • debugExceptionWidget.border#ed1c24
  • dropdown.background#04152b
  • dropdown.border#0d1c29
  • dropdown.listBackground#04152b
  • editor.background#001928
  • editor.findMatchHighlightBackground#665200
  • editor.lineHighlightBackground#082050
  • editor.selectionBackground#343957
  • editorCursor.foreground#f0f
  • editorGroup.border#0d1c29
  • editorGroup.emptyBackground#030b15
  • editorGroupHeader.noTabsBackground#030b15
  • editorGroupHeader.tabsBackground#030b15
  • editorGroupHeader.tabsBorder#0d1c29
  • editorHoverWidget.background#000c38
  • editorHoverWidget.border#00ae42
  • editorIndentGuide.activeBackground#204972
  • editorIndentGuide.background#002952
  • editorLineNumber.activeForeground#80a2c2
  • editorLineNumber.foreground#406385
  • editorLink.activeForeground#0063a5
  • editorMarkerNavigation.background#060621
  • editorMarkerNavigationError.background#ed1c24
  • editorMarkerNavigationWarning.background#5B7E7A
  • editorWhitespace.foreground#103050
  • editorWidget.background#262641
  • editorWidget.resizeBorder#00334f
  • input.background#04152b
  • inputValidation.errorBackground#ed1c24
  • inputValidation.errorBorder#ed1c24
  • list.activeSelectionBackground#0075c9
  • list.hoverBackground#0000004D
  • list.inactiveSelectionBackground#1c99f1
  • panel.background#04152b
  • progressBar.background#0075C9
  • sideBar.background#04152b
  • statusBar.background#00334f
  • statusBar.noFolderBackground#00334f
  • tab.inactiveBackground#04152b
  • terminal.ansiBlack#000000
  • terminal.ansiBlue#0075c9
  • terminal.ansiBrightBlack#4a4a4a
  • terminal.ansiBrightBlue#0071ce
  • terminal.ansiBrightCyan#7adbff
  • terminal.ansiBrightGreen#70d44b
  • terminal.ansiBrightMagenta#b31983
  • terminal.ansiBrightRed#ed1c24
  • terminal.ansiBrightWhite#ffffff
  • terminal.ansiBrightYellow#ffcd00
  • terminal.ansiCyan#00334f
  • terminal.ansiGreen#00ae42
  • terminal.ansiMagenta#ed40a9
  • terminal.ansiRed#ff555a
  • terminal.ansiWhite#d9d8d6
  • terminal.ansiYellow#f5a800

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#299FFF
constant.numeric#ed40a9
storage.type#813691
markup.inline.raw#612c6b
support.function#9966b8
support.constant#9966b8
support.type, support.class#813691italic
string#00ae42
entity.name.class, entity.name.type#ffcd00underline
entity.other.inherited-class#f5a800italic underline
entity.name.function#f5a800
entity.other.attribute-name#f5a800
markup.deleted#ed1c24
markup.changed#ed1c24

Shiki preview

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

Loading...

Workbench Themes - Coding Theme