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#423002
  • activityBar.border#b8860b
  • activityBar.foreground#ffffff
  • activityBar.inactiveForeground#b8860b
  • badge.background#b8860b
  • badge.foreground#ffffff
  • button.background#b8860b
  • button.foreground#ffffff
  • button.hoverBackground#423002
  • descriptionForeground#ffffff
  • dropdown.background#b8860b
  • dropdown.border#2493b4
  • dropdown.foreground#ffffff
  • editor.background#66b0d9
  • editor.foreground#ffffff
  • editor.lineHighlightBackground#86c5f7
  • editor.lineHighlightBorder#86c5f7
  • editor.selectionBackground#86c5f7
  • editor.selectionHighlightBackground#86c5f7
  • editor.wordHighlightBackground#86c5f7
  • editor.wordHighlightStrongBackground#86c5f7
  • editorBracketMatch.background#86c5f7
  • editorBracketMatch.border#86c5f7
  • editorCursor.foreground#86c5f7
  • editorGroup.border#2493b4
  • editorGroupHeader.tabsBackground#66b0d9
  • editorGroupHeader.tabsBorder#2493b4
  • editorLineNumber.activeForeground#ffffff
  • editorLineNumber.foreground#ffffff
  • editorWhitespace.foreground#86c5f7
  • errorForeground#cd9b1d
  • focusBorder#b8860b
  • foreground#ffffff
  • icon.foreground#ffffff
  • input.background#b8860b
  • input.border#423002
  • input.foreground#ffffff
  • input.placeholderForeground#ffffff
  • list.activeSelectionBackground#2493b4
  • list.focusBackground#b8860b
  • list.hoverBackground#2493b4
  • list.inactiveSelectionBackground#2493b4
  • panel.background#423002
  • panel.border#b8860b
  • panelTitle.activeBorder#b8860b
  • panelTitle.activeForeground#ffffff
  • panelTitle.inactiveForeground#b8860b
  • progressBar.background#b8860b
  • sideBar.background#423002
  • sideBar.border#b8860b
  • sideBar.foreground#ffffff
  • sideBarTitle.foreground#ffffff
  • statusBar.background#423002
  • statusBar.border#b8860b
  • statusBar.foreground#ffffff
  • tab.activeBackground#66b0d9
  • tab.activeForeground#ffffff
  • tab.border#2493b4
  • tab.hoverBackground#66b0d9
  • tab.inactiveBackground#66b0d9
  • tab.inactiveForeground#ffffff
  • tab.unfocusedHoverBackground#66b0d9
  • textBlockQuote.background#2493b4
  • textBlockQuote.border#2493b4
  • textLink.activeForeground#ffffff
  • textLink.foreground#2493b4
  • titleBar.activeBackground#423002
  • titleBar.activeForeground#ffffff
  • titleBar.border#b8860b
  • titleBar.inactiveBackground#423002
  • titleBar.inactiveForeground#b8860b

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#ffffff
keyword#ffffff
variable#ffffff
string#ffffff
constant.numeric#ffffff
egyptian by Gareth McIntosh - VS Code Theme